Hitu Bansal
Hitu Bansal

Reputation: 3137

GraphicsMagick using nodejs not returning correct image

I am using GraphicsMagick.

This is the image:

https://hbr.org/resources/images/article_assets/hbr/1405/F1405A_A.gif

which I used for cropping:

enter image description here

My code is here:

 gm(request(url), "myimage.jpeg")
    .resize(270, 270, '^')
    .gravity('Center')
    .quality(50)
    .crop(270,270)
    .compress('JPEG')
    .flatten()
    .stream(function (err, stdout, stderr) {
            if (err)
                console.log(err);
            else {
                //upload the file
                file.uploadFileFromGm(fileDetails, stdout, cb);
            }
        });

The code is working fine.

But I got an transparent image which is empty on left side.

I got the following image as a result:

enter image description here

Why is white background not working in the transparent portion? Any idea how to resolve this?

Upvotes: 1

Views: 343

Answers (2)

Hazarapet Tunanyan
Hazarapet Tunanyan

Reputation: 2865

Do you need something like this?

http://www.w3docs.com/tools/image-optimiser/

Upvotes: 0

Mark Setchell
Mark Setchell

Reputation: 207465

Your input image is a GIF and has transparency. Your output file is a JPEG which cannot support transparency, so GraphicsMagick has rendered the transparent pixels as black - the default background colour.

You have two choices:

  1. Store your image as GIF, or PNG which can represent transparency

  2. Change the background colour to solid (non-transparent) white and store as JPEG.

Which one you choose depends on where/how you plan to use the image and whether the background behind the image must be visible where you are going to use it.

Upvotes: 2

Related Questions