lovell / lovell/sharp

1 bit dithered PNG without palette

Open
#3,322 7 comments 1 reaction 0 assignees View on GitHub

Nobody has claimed this yet.

blocked-upstream-dependency enhancement
Dominant language
JavaScript
Stars
32.7k
Forks
1.4k
Avg merge
1d 14h
Merged PRs (30d)
5

Description

## Question about an existing feature

### What are you trying to achieve?

I am trying to make an 1 bit per pixel PNG image, but I want the colors to be pure black and white. When setting colours to 2, it uses a palette that may contain grayscales, which looks really bad when tiled.

I tried manually setting only options.pngBitdepth, but then no dithering occurs.

### When you searched for similar issues, what did you find that might be related?

https://github.com/lovell/sharp/issues/2855
https://github.com/lovell/sharp/issues/2828

Some issues about getting dithered images, or 1 bit images, but everyone seems fine with a potentially gray palette.

### Please provide a minimal, standalone code sample, without other dependencies, that demonstrates this question

extracted from https://github.com/maptiler/tileserver-gl/blob/master/src/serve_rendered.js but modified to output 1 bit dithered black and white.
```js
const image = sharp(data, {
raw: {
width: params.width * scale,
height: params.height * scale,
channels: 4
}
});
image.toColourspace('b-w');
image.removeAlpha();

image.png({ adaptiveFiltering: false, dither: 1.0, colours: 2});
image.toBuffer((err, buffer, info)
```

### Please provide sample image(s) that help explain this question
This is what the tiles look like with this option

![image](https://user-images.githubusercontent.com/168609/182885573-f68071f8-1cc1-4197-83d3-604ec00dc362.png)

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

The entry point is image.png({ adaptiveFiltering: false, dither: 1.0, colours: 2 }) in the supplied JavaScript sample; compare it with related issues #2855 and #2828. Done means producing a 1-bit dithered PNG whose palette contains only pure black and white.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, nodejs
Domain
computer-graphics
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.