2014-10-03 134 views
1

我想使用gm()和NodeJS製作馬賽克圖像,但它看起來不適合我的代碼,我認爲問題是由於圖像的原始大小600 * 200),我的模板比圖像小...使用GM()和NodeJS製作馬賽克圖像

我的結果應該是這樣的:

enter image description here

我的代碼:

gm() 
.in('-page', '+0+0') 
.in('./public/images/instafilm.jpg') // my empty template, white and 142 * 500 
.in('-page', '+10+10') 
.resize(122, 122, '!') 
.in('./public/images/firstimage.jpg') // 600 * 600 
.in('-page', '+10+132') 
.resize(122, 122, '!') 
.in('./public/images/secondimage.jpg') // 600 * 600 
.in('-page', '+10+164') 
.resize(122, 122, '!') 
.in('./public/images/thirdimage.jpg') // 600 * 600 
.in('-page', '+10+296') 
.resize(122, 122, '!') 
.in('./public/images/fourthimage.jpg') // 600 * 600 
.mosaic() 
.minify() 
.write(newFileName, function (err) { 
    if (!err) console.log('done'); 
    if (err) console.log(err); 
    callback(); 
}); 

回答

0

我ñ ot專家在gm,但這裏是我的建議:

您可以嘗試並刪除相對路徑,並使用絕對代替。另外,我不確定你需要在所有.in('-page', '+10+xxx')之後調整大小,我認爲你可能會刪除所有附加的圖像。

此外,我不認爲你需要包裝圖像。無論如何,它將被創建。

嘗試:

gm() 
.in('-page', '+10+10') 
.in('/usr/home/**/firstimage.jpg') // absolute path 
.in('-page', '+10+132') 
.in('./public/images/secondimage.jpg') //absolute path 
.in('-page', '+10+164') 
.in('/usr/home/**/thirdimage.jpg') //absolute path 
.in('-page', '+10+296') 
.in('/usr/home/**/fourthimage.jpg') //absolute path 
.mosaic() 
.minify() 
.write(myAbsoluteFilePath, function (err) { 
    if (!err) console.log('done'); 
    if (err) console.log(err); 
    callback(); 
}); 

如果你需要一個矩陣,你可以使用這樣的:當我使用settings.imgSize.marginXsettings.imgSize.marginY在圖像之間創造利潤

var img = gm(); 

    for(var r = 0; r < settings.canvasSize.rows; r++){ 
     for(var c = 0; c < settings.canvasSize.cols; c++){ 
      var y = r * settings.imgSize.height + (settings.imgSize.marginY * r); 
      var x = c * settings.imgSize.width + (settings.imgSize.marginX * c); 

      img.in('-page', '+'+x+'+'+ y).in(settings.imgSize.path); 
     } 
    } 

    img 
     .mosaic() 
     .write(getNewFilename(), function(err){ 
      console.log(err); 
     });