Search code examples
node.jsimagegraphicsmagick

Create transparent image with background in node.js and graphicsmagick


How can I create the following effect using GraphicsMagick in node.js (using the gm library)?

  • read image from buffer
  • set a background color
  • blur
  • opacity
  • return new image as buffer

What I am trying does not work:

gm(buffer)
    .background("#ff00aa")
    .blur(10,5)
    .operator('Opacity', 'Assign','30%')
    .resize(width)
    .toBuffer("JPG", function (err, buffer) {
        ...
    });

What I want is this result:

enter image description here


Solution

  • Managed to solve it:

    gm(buffer)
        .out("-matte")
        .out("-operator", "Opacity", "Assign", "90%")
        .out("-flatten")
        .out("-background", "#ff00aa")
        .blur(100,30)
        .resize(width)
        .toBuffer("JPG", function (err, buffer) {
            handleResponse(deferred, err, buffer)
        });