web-dev-qa-db-ja.com

ImageMagickを使用して、アンチエイリアスを使用してSVGを透過PNGに変換します

SVG画像を透明な背景とアンチエイリアスされたエッジ(半透明のピクセルを使用)を持つPNGファイルに変換したい。残念ながら、ImageMagickにアンチエイリアシングを実行させることはできません。エッジは常にひどく見えます。ここに私が試したものがあります:

convert +antialias -background transparent  in.svg -resize 25x25 out.png

私が使用できるアイデアや別のコマンドラインツールはありますか?

60
Andreas Gohr

Inkscapeはこれを行います:

inkscape \
    --export-png=out.png --export-dpi=200 \
    --export-background-opacity=0 --without-gui in.svg
55
halfer

副次的な注意事項として、透明性を確保するのは少し難しいことがわかりました。 transparentを使用する代わりに、noneを使用する必要がありました。

convert -background none in.svg out.png
83
Micah

実際、imagemagickのドキュメントを読む:

-アンチエイリアス

フォントと線を描画するときのアンチエイリアスピクセルのレンダリングの有効化/無効化。デフォルトでは、オブジェクト(テキスト、線、多角形など)は描画時にアンチエイリアス処理されます。 + antialiasを使用して、アンチエイリアスエッジピクセルの追加を無効にします。これにより、
直接描画される色だけに画像に追加される色の数。つまり、このようなオブジェクトを描画するときに、混合色は追加されません。

+ antialiasは実際にアンチエイリアスを無効にします。

16
sleeper

私がこれを行う方法を学んだ方法は、ここにある方法論からでした: 。epsファイルを高品質の1024x1024 .jpgに変換する方法?

inkscapeを使用した@halferのソリューションと同じ考えです-最初にDPIをジャッキアップします--densityオプションを使用して、imagemagickだけで同じことを達成できます。

convert -density 200 in.svg -resize 25x25 -transparent white out.png
10
chiliNUT

_-transparent white_オプションの追加特に問題を解決します私の場合、背景が完全に削除されていないため(残念ながら明るい影が存在します)。だから私はより明確に私見を使用しています背景を完全に削除する解決策 ImageMagicで:

convert -channel rgba -background "rgba(0,0,0,0)" in.svg out.png

RGBAチャンネルを介して背景として完全に透明な黒色を設定します。

1
Yurii Rabeshko

背景として四角形を追加します。埋め込みCSSは背景を隠します。次に、ImageMagickの透明属性を設定するための色をキャッチします。


SVGファイル:

<?xml version="1.0" ?>
<!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'>
<svg 
    version="1.1" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
    width="500px" height="500px"
    viewBox="0 0 500 500" 
    enable-background="new 0 0 500 500" 
    >
<defs>
    <style>
        #background { display: none; }
    </style>
</defs>
<rect id="background" x="0" y="0" width="500" height="500" fill="#e8e437"/>
<!-- beginning of the sketch -->
<g fill="#000" text-anchor="middle"font-size="112">
    <text y="350" x="192">OK</text>
</g>
<!-- end of the sketch -->
</svg>

bashスクリプト

#!/bin/bash


BASE_DIR=$( cd "$( dirname "${BASH_SOURCE[0]}" )" >/dev/null && pwd )
SVG_DIR="$BASE_DIR/import"
PNG_DIR="$BASE_DIR/export"

for f in `ls $SVG_DIR/*.svg`
do
    g="$PNG_DIR/$(basename "$f" .svg).png"
    BGCOLOR=`grep 'id="background"' $f \
        | sed 's/.* fill="\([^"]*\)".*/\1/'`

    convert $f -transparent "$BGCOLOR" $g
done
0
C Würtz