Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

octree renders black pixels as transparent #11

Open
pixelsage opened this issue Jun 10, 2021 · 4 comments
Open

octree renders black pixels as transparent #11

pixelsage opened this issue Jun 10, 2021 · 4 comments

Comments

@pixelsage
Copy link

pixelsage commented Jun 10, 2021

As long as setTransparent() isn't set to null, octree will render black pixels as transparent. For anyone else running into this issue, one workaround is to set the encoder to neuquant instead, which does not have this issue.

Bugged:
const encoder = new GIFEncoder(256, 256, 'octree', true);

Working:
const encoder = new GIFEncoder(256, 256, 'neuquant', true);

Caveat: In certain cases, neuquant colors will not be as accurate.

@pixelsage
Copy link
Author

pixelsage commented Jun 10, 2021

The offending code seems to be findClosest(c). It always returns with a value that turns black pixels transparent in octree.

EDIT: Or perhaps the octree algorithm turns transparent pixels black?

@pixelsage
Copy link
Author

@benjaminadk Any chance you could take a quick peek at this?

@PacaPop
Copy link

PacaPop commented Jan 4, 2022

I'm in the same boat here. This is definitely the function findClosest(c) that always returns -1.
Maybe we should find a way to set the variable transIndex manually to the color we want.
Anyone found a solution?

@antonvinceguinto
Copy link

Oh lord it took me HOURS for this but I got mine working! here's what I did:

script.js file

        const file = require('fs').createWriteStream(`${storage}/${name}.gif`);
        const gif = new GifEncoder(fw, fh, 'octree', true);

        gif.setRepeat(0);
        gif.setFrameRate(Number(framerate));
        gif.setQuality(Number(quality));
        gif.createReadStream().pipe(file);
        gif.start();

I commented this line in the GifEncoder.js library

    // if (this.transparent !== null) {
    //   this.transIndex = this.findClosest(this.transparent)

    //   for (var pixelIndex = 0; pixelIndex < nPix; pixelIndex++) {
    //     if (this.image[pixelIndex * 4 + 3] == 0) {
    //       this.indexedPixels[pixelIndex] = this.transIndex
    //     }
    //   }
    // }

Then proceed with generating

? Enter folder directory. Press "enter" for auto: build/images
? Enter name (no extension). Leave blank to convert all: 
? Enter storage folder directory. Press "enter" for auto: build/gifs
? Enter frames per second: 10
? Enter frame width. Leave blank for auto: 
? Enter transparent color in hex: 000000
? Enter quality (1 = best; 20 = worst): 10
? Proceed with conversion? Yes

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants