2016-11-15 222 views
1

給定兩個圖像,比如在img(大小爲1024x768)的文件夾(img1.png和img2.png)下,我需要調整img2的大小(比如300x300) img1在img1左上方的x和y(比如100,200)。最終結果應該是1024x768大小的圖像。在Nodejs中使用gm調整大小和構圖兩個或多個圖像

利用GM(https://github.com/aheckmann/gm),嘗試這樣做:

gm('./img/img1.png') 
.composite('./img/img2.png') 
.geometry('300x300+100+200') 
.write('resultGM.png', (err) => { 
    if (err) console.log(err); 
}); 

預期地(因爲整個操作鏈的)它產生300×300的圖像。 然後我嘗試這樣的:

gm('./img/img1.png') 
.composite(
    gm('./img/img2.png') 
    .geometry('300x300+100+200') 
) 
.write('resultGM.png', (err) => { 
    if (err) console.log(err); 
}); 

希望複合功能接收緩衝區,但沒有機會,它只接受文件的路徑,並提示錯誤。花費2-3小時,閱讀幾篇文章後(僅可以在這裏找到一些討論:How to do composite with gm node.js?在這裏:Combine two gm objects while resizing one of them in graphicsMagick for NodeJS(這一個不回答,其實這個問題),我找不到任何解決方案使用做內存此操作流或緩衝區。這是可能的,同時寫入到一個臨時文件的事情。是否有任何機構在那裏誰可以在存儲器中找到一個解決方案在運行調整和合並圖像?

回答

1

使用,而不是GraphicMagic ImageMagick的;

經過幾個小時的搜索後,終於找到了如何合併兩個圖像,使用gm調整圖層大小和重新排序圖層位置(上,下等)。

讓我們來看看這個形象第一:

enter image description here

幾分鐘挖ImageMagick的撰寫幫助頁面後,我看到的DstOver定位使用。

http://www.imagemagick.org/Usage/compose/#dstover

所以,下面我有試過這個代碼和它的工作就像一個魅力!

imageMagick(background) 
    .composite(image) 
    .in('-compose', 'Dst_Over') 
    .in('-geometry', '253x253+15+15') 
    .write(output, function (err) { 
    if (err) console.error(err); 
     else console.log('Compose OK!'); 
    }); 
+0

順便說一句,爲了組成圖像,節點畫布真的比Gm或IM更好,更快。 –

+0

還沒有試過。我會看看我完成了我目前的項目。仍然需要按照我看到的安裝軟件包。帆布非常適合對齊 - 定位實體。謝謝你的建議。 –

+0

是的,它需要開羅和攀高 –

0

最後我能做到這一點,我在這裏發佈供參考的人可能需要它:

gm() 
.in('-geometry', '+0+0') 
.in('./img/img1.png') 
.in('-geometry', '300x300+100+200') 
.in('./img/img2.png') 
.flatten() 
.write('resultGM.png', function (err) { 
    if (err) console.log(err); 
}); 
+0

這種方式對我不起作用。我安裝了ImageMagick,因此將使用imagemagick而不是graphicmagic。看到我的答案。 –