Fusionar 2 imágenes con node.js?

Question

Quiero unir 2 imágenes usando node.js. O más bien, quiero colocar una imagen más pequeña en cordinates x, y en una imagen más grande. Aún más preciso: tengo una imagen de gafas y una imagen de una cara y quiero poner las gafas en la cara. Hice algunas búsquedas en Google y encontré algunas bibliotecas de manipulación de imágenes, pero ninguna parece ser capaz de combinar imágenes.

Answer 1

he utilizado:

https://github.com/learnboost/node-canvas

hacer algo similar (construir una imagen compuesta a partir de componentes sobre la marcha).

Funciona muy bien.

Aquí hay un código de ejemplo:

var Canvas = require('canvas'), 
    fs = require('fs'), 
    Image = Canvas.Image; 



var _components = [{prefix:'f', count:12}, 
        {prefix:'h', count:12}, 
        {prefix:'i', count:12}, 
        {prefix:'m', count:12}]; 


var _total = 1; 
for (var i=_components.length - 1; i>=0; i--){ 
    _components[i].mult = _total; 
    _total *= _components[i].count; 
} 


module.exports.ensureImageExists = function(img, cb){ 
    fs.stat(__dirname + '/../public/images/rb/' + img, function(err, stats){ 
    if (err){ 
     if (err.code == 'ENOENT') 
     generateImage(img, cb); 
     else 
     cb(err); 
    } 
    else{ 
     cb(); 
    } 
    }); 
} 

function generateImage(name, cb){ 
    var re = /rb([0-9]*)\.png/ 

    var num = parseInt(re.exec(name)[1]) % _total; 

    var parts = []; 
    for (var i=0; i<_components.length; i++){ 
    var n = Math.floor(num/_components[i].mult); 
    parts.push(_components[i].prefix + (n + 1)); 
    num -= n * _components[i].mult; 
    } 

    var canvas = new Canvas(45, 45), 
    ctx = canvas.getContext('2d'); 

    drawParts(); 

    function drawParts(){ 
    var part = parts.shift(); 
    if (!part) 
     saveCanvas(); 
    else { 
     var img = new Image; 
     img.onload = function(){ 
     ctx.drawImage(img, 0, 0, 45, 45); 
     drawParts(); 
     }; 
    img.src = __dirname + '/components/' + part + '.png'; 
    } 
    } 

    function saveCanvas(){ 
    canvas.toBuffer(function(err, buf){ 
     if (err) 
     cb(err); 
     else 
     fs.writeFile(__dirname + '/../public/images/rb/' + name, buf, function(){ 
      cb(); 
     }); 
    }); 
    } 

} 

En este caso, los componentes se seleccionan basándose en el nombre de la imagen, pero que claramente podría hacer de otra manera. Además, me imagino que podrías transmitir la imagen si lo deseas; la escribo en un archivo para que esté disponible la próxima vez que se solicite.

puse una ruta como esta en manejar la generación:

app.get('/images/rb/:img', requireLogin, function(req, res, next){ 
    //first make sure image exists, then pass along so it is handled 
    //by the static router 
    rbgen.ensureImageExists(req.params.img, function(err){ 
    next(); 
    }) 
}); 

Answer 2

Es posible que tenga esto: https://github.com/zhangyuanwei/node-images

multiplataforma imagen decodificador (PNG/JPEG/GIF) y el codificador (png/jpeg) para Nodejs

images("big.jpg").draw(images("small.jpg"), 10, 10).save("output.jpg");