圓形圖像轉角GM ImageMagic，通過選項

嗨我想轉換一些圖像的圓角。我發現這可怎麼用ImageMagic來完成他們的網站上圓形圖像轉角GM ImageMagic，通過選項

convert thumbnail.gif \ 
    \(+clone -crop 16x16+0+0 -fill white -colorize 100% \ 
     -draw 'fill black circle 15,15 15,0' \ 
     -background Red -alpha shape \ 
     \(+clone -flip \) \(+clone -flop \) \(+clone -flip \) \ 
    \) -flatten rounded_corners_red.png

的問題是，我不知道怎麼打發這一切的選擇到GM。我試過

gm.in("\(+clone -crop 16x16+0+0 -fill white -colorize 100% 
      -draw 'fill black circle 15,15 15,0' 
      -background Red -alpha shape 
      \(+clone -flip \) \(+clone -flop \) \(+clone -flip \) 
     \) -flatten")

但它不工作。這就是我如何調整我的圖片

var gm = require("gm").subClass({ imageMagick: true }) 
var _ = require("lodash") 
var images = ['1b.jpg', '2b.jpg', '3b.jpg'] 

_.forEach(images, function(image, key) { 

    var img = gm(__dirname + '/' + image) 
    var dest = __dirname + '/' + key+'.jpg' 
    img.resize('100', '100', '^') 
    img.gravity('Center') 
    img.crop('100', '100') 

    img.in("\(+clone -crop 16x16+0+0 -fill white -colorize 100% 
      -draw 'fill black circle 15,15 15,0' 
      -background Red -alpha shape 
      \(+clone -flip \) \(+clone -flop \) \(+clone -flip \) 
     \) -flatten") 

    img.write(__dirname + '/' + key+'.jpg', function (err) { 
    if (!err) console.log(' image done! '); 
    }) 

})

來源

2016-10-22 Alex

你要紅色或透明的角落？您的圖像是否要將圓角應用於大致相同的尺寸 - 如果是，尺寸是多少？ –

所以我試圖做的是自動化這個過程，所以在這個例子中圖像的大小是100x100，但在某些時候可能會有所不同。您可以從上面的示例中看到圖像已被調整大小和裁剪，因此在此之後，我想使其具有圓角。關於背景我更喜歡透明，但如果不可能的話，任何顏色都可以很好 – Alex

我不相信GraphicsMagick工具支持括號，這似乎做事的方式很複雜的。我想我會製作一個alpha蒙版，顯示我希望圖片不透明/透明的位置，並將其複製到圖像中。

所以，具體而言：

convert -size 100x100 xc:none -draw "roundrectangle 0,0,99,99,12,12" mask.png

convert -size 100x100 gradient:blue-yellow mask.png -compose copyopacity -composite result.png

另外請注意，您將無法透明的角落存儲，因爲JPEG一個JPEG輸出文件不支持透明度。

如果你想紅的角落，你可以這樣做：

convert -size 100x100 xc:red -draw "roundrectangle 0,0,99,99,12,12" -transparent black mask.png 
convert -size 100x100 gradient:blue-yellow mask.png -composite result.png

來源

2016-10-22 11:49:27

最近版本的ImageMagick支持括號。見http://www.imagemagick.org/Usage/basics/#parenthesis –

@JonAdams我指的是** GraphicsMagick **不支持括號。 –

我不知道GraphicMagick，但是操作人員詢問_ImageMagick_，而不是GM。我的觀點是，使用括號的op原始解決方案仍然可以在理論上工作......通過轉換談論非常相似但不完全相同的GM，您的答案有點混亂。我不是在說你錯了或不是（我在這兩種工具中都不是專家） - 我只是想澄清未來的用戶，他們可能不知道GM和IM之間的差異。（甚至提醒自己，因爲我發現它們之間的區別也很混亂。） –

圓形圖像轉角GM ImageMagic，通過選項

回答

相關問題