Generated image background is grey. Potentially related to new version of gm

[irgipaulius]

This wasn't happening until a week ago or so.

I've noticed that ImageGraphick released a new version 7.1.0-22 a week ago, but running the convert manually generates a transparent background, instead of this ugly greyish one.

Same happens when converting to jpg, but running it manually creates a white background.

As I said, this started happening only a week ago, when I probably accidentally upgraded it using brew, and I can't seem to install an older version (not sure how to setup paths on macos...)

Steps to reproduce

install and get a reference correct output:

brew install graphicsmagick
brew install imagemagick
convert sample.pdf output.png

and then, if you were to run this example on the same pdf, the result will have a greyed background.

screenshot of the actual pdf:

generated png:

in case it'd be useful, here are my options for the app I'm running this on:

{
    density: 96,
    saveFilename,
    savePath: destinationPath,
    format: "png",
    height: finalHeight,
    width: finalWidth,
  }

if you can't really help me, maybe you could teach me how to install older versions of ImageGraphick so I could see if those work well?

[runwayfour]

@irgipaulius I have had the same issue and had forked the code to see if I could fix it, when I noticed that it seems better when using imagemagick vs graphicsmagick. i.e. when doing a conversion like this:

const fp = fromPath(filepath, options);
fp.setGMClass("imagemagick"); /* This being the key difference */
let r = await fp.bulk(pageIdx, false)

Hope that helps a) you fix your issue and b) the maintainers debug things if its deemed to be an issue!

[irgipaulius]

@runwayfour thanks, this kind of worked!

I used:

storeAsImage.setGMClass(true);

now I just need to figure out how to add white background and I'm set 🙂

Should the developers find this as an appropriate solution, the issue can be closed.

[LukeBrandon]

@irgipaulius Did you figure out how to create a white background? My code is generating png's with transparent backgrounds and I want it to be white. I have also tried outputting jpg's and the entire image is solid black.

[irgipaulius]

@LukeBrandon unfortunately I did not figure out how to achieve that with pdf2image, so instead I installed the gm package and fixed the issue using .background('#FFF').mosaic().matte(). The result actually gave me better performance than this repo could.

private async rasterize(readStream: ReadStream, page: number) {
    const newFilename = `${this.options.destinationPath}/${
      this.options.saveFilename
    }_${page + 1}.png`;

    return new Promise<WriteImageResponse>((resolve, reject) => {
      const command = this.gm(readStream, `${readStream.path}[${page}]`)
        .density(96, 96)
        .resize(this.finalWidth, this.finalHeight, "!") // ignore aspect ratio
        .quality(75)
        .background("#FFF") // white
        .mosaic()
        .matte()
        .compress("jpeg"); // this is compression, not format.

      return command.write(newFilename, (error) => {
        if (error) {
          return reject(error);
        }

        this.raster?.emitProgress(); // emit progress log

        return resolve({
          name: path.basename(newFilename),
          size: `${this.finalWidth}x${this.finalHeight}`,
          fileSize: fs.statSync(newFilename).size / 1000.0,
          path: newFilename,
          page: page + 1,
        });
      });
    });
  }

Best regards

[LukeBrandon]

@irgipaulius Thank you for that. I'll have to check that out.