1

I have an image and would like to apply a watermark (another image) over it using Node.js. The requirement is watermark shouldn't be a solid picture (what I can do with gm library's draw()) but half transparent. Can you please advise any tool to use?

make_sense
  • 464
  • 4
  • 14

3 Answers3

5

Use ImageMagick from the command line by forking a child-process

// Require our module dependencies
var exec = require('child_process').exec;

// Create command array to invoke ImageMagick composite where
// -dissolve is the amount of transparency for the watermark
// -gravity tells how to align images of varying size
// -quality is the image quality of the JPEG (not required if producing PNG)
var command = [
    'composite',
    '-dissolve', '50%',
    '-gravity', 'center', 
    '-quality', 100,
    '/path/to/watermark.png',
    '/path/to/image.jpg',
    '/path/to/save/result.jpg';
];

// Join command array by a space character and then execute command
exec(command.join(' '), function(err, stdout, stderr) {
    // Do stuff with result here
});

If you need an API abstraction, there is a great module found here https://github.com/rsms/node-imagemagick

Terry
  • 14,099
  • 9
  • 56
  • 84
srquinn
  • 10,134
  • 2
  • 48
  • 54
5

You could make watermark image half-transparent already and use it with gm:

gm('/path/to/input-image.jpg')
.draw(['image Over 0,0 0,0 /path/to/half-transparent-watermark-image.png'])
.write('/path/to/output-image.jpg', function(e){
 console.log(e||'done'); // What would you like to do here?
});
Victor.Palyvoda
  • 523
  • 3
  • 12
-2

I use code

gm('/path/to/input-image.jpg')
.draw(['image Over 0,0 0,0 /path/to/half-transparent-watermark-image.png'])
.write('/path/to/output-image.jpg', function(e){
 console.log(e||'done'); // What would you like to do here?
});

Error: Command failed: convert: Non-conforming drawing primitive definition `/path/to/half-transparent-watermark-image.png''@ draw.c / DrawImage / 3124

Mr.Dung
  • 333
  • 1
  • 3
  • 10
  • 1
    OK. You got my attention after 2 months. I did not visited stackoverflow.com for a while because I was very busy. So, you said my code is not working. Well, first of all, my code is abstract. "/path/to/" means that you have to replace with real path of file you want to use with gm. Next, it's important to configure your node.js app and dependencies (including native libraries of graphics magick), make sure you installed all necessary libraries(packages). – Victor.Palyvoda Jun 10 '15 at 20:51
  • I use Ubuntu OS (and sometimes Debian too) on servers and desktop PCs. I installed Graphics Magick with "sudo apt-get install graphicsmagick". Look, I'm practice man, I never put my words without proven code. Before writing this post, I wrote a sample app to make sure this code still works (maybe things are changed and this code does not work anymore). But here it is: https://drive.google.com/file/d/0ByQtcR01oXR5TjFYOWRXQ3pzbUk/view?usp=sharing – Victor.Palyvoda Jun 10 '15 at 20:51
  • check out "app.js" and "res/out.jpg" (download that archive from Google Drive). I hope, this will help you. – Victor.Palyvoda Jun 10 '15 at 20:56