web-dev-qa-db-ja.com

Image Magickを使ってSVGをPNGに変換する方法は？

私は16×16の定義済みサイズを持つSVGファイルを持っています。 Image Magickのconvertプログラムを使用してそれをPNGに変換すると、16 x 16ピクセルのPNGが得られますが、これは小さすぎます。

convert test.svg test.png

出力PNGのピクセルサイズを指定する必要があります。 -sizeパラメータは無視されるようです。-scaleパラメータはPNGをスケーリングします。after PNGに変換されています。これまでの最良の結果は、-densityパラメータを使用することによって得られました。

convert -density 1200 test.svg test.png

しかし、密度値を計算するのに数学をせずにピクセル単位で出力サイズを指定したいので、私は満足していません。だから私はこのようなことをしたいです。

convert -setTheOutputSizeOfThePng 1024x1024 test.svg test.png

それで、ここで使用しなければならない魔法のパラメータは何ですか？

svgimagemagickpng
327
kayahr

私はこの場合ImageMagickから良い結果を得ることができませんでした、しかしInkscapeはLinuxとWindowsでそれのいい仕事をします：

inkscape -z -e test.png -w 1024 -h 1024 test.svg

これは、このコマンドを使用して16 x 16 SVGを200 x 200 PNGに拡大縮小した結果です。

enter image description here

enter image description here

参考までに、私のInkscapeのバージョン（Ubuntu 12.04）は次のとおりです。

Inkscape 0.48.3.1 r9886 (Mar 29 2012)

そしてWindows 7では、それは次のとおりです。

Inkscape 0.48.4 r9939 (Dec 17 2012)
420
808sound

svgexport を試してください。

svgexport input.svg output.png 64x
svgexport input.svg output.png 1024:1024

svgexportは私がsvgファイルをjpgとpngにエクスポートするために作った簡単なクロスプラットフォームのコマンドラインツールです。より多くのオプションについてはここでを見てください。 svgexport をインストールするには、npm をインストールしてから、次のコマンドを実行します。

npm install svgexport -g

編集：ライブラリに関する問題を見つけたら、GitHubで 提出してください 、ありがとう！

116
Ali Shakiba

これは完璧ではありませんが、それは仕事をします。

convert -density 1200 -resize 200x200 source.svg target.png

基本的にそれは十分に高いDPIを増加させ（ちょうど教育を受けた/安全な推測を使用して）、サイズ変更が適切な品質で行われるようにします。私はこれに対する適切な解決策を見つけようとしていましたが、しばらくしてこれが私の現在のニーズに十分に適していると判断しました。

注：200 x 200を使用してください。与えられた解像度を強制する

93
Hardev

MacOS Xを使用していてImagemagickの変換に問題がある場合は、RSVG libに再インストールしてみてください。 HomeBrewを使う：

brew remove imagemagick
brew install imagemagick --with-librsvg

正しく委任していることを確認します。

$ convert -version
Version: ImageMagick 6.8.9-8 Q16 x86_64 2014-12-17 http://www.imagemagick.org
Copyright: Copyright (C) 1999-2014 ImageMagick Studio LLC
Features: DPC Modules
Delegates: bzlib cairo fontconfig freetype jng jpeg lcms ltdl lzma png rsvg tiff xml zlib

rsvgが表示されます。

52
Jose Alban

Svg単位がpxでなければInkscapeはうまくいかないようです（例えばcm）。空白の画像が出ました。たぶん、それはdpiをいじることによって修正されるかもしれません、しかしそれはあまりにも面倒でした。

Svgexportはnode.jsプログラムなので、通常は役に立ちません。

Imagemagickの変換はうまく動作します：

 ~$ convert -background none -size 1024x1024 infile.svg outfile.png

-resizeを使用した場合、画像はぼやけ、ファイルははるかに大きくなります。

BEST

~$ rsvg  -w 1024 -h 1024 infile.svg  outfile.png

それは最も速く、依存性が最も少なく、出力はconvertよりも約30％小さくなります。入手するにはlibrsvg2-binをインストールしてください。マニュアルページは表示されませんが、次のように入力できます。

~$ rsvg --help

いくつかの援助を得るために。シンプルがいいです。

33
september_converter

Jose Albanの回答 の手順に従った後、次のコマンドを使用してImageMagickを正常に動作させることができました。

convert -density 1536 -background none -resize 100x100 input.svg output-100.png

1536という数値は、球場での密度の推定値です。詳細については、 this answer を参照してください。

16
Ian

画像を拡大縮小するには、オプション-densityを使用する必要があります。私の知る限りでは、標準密度は72で、サイズは1：1です。出力pngを元のsvgの2倍にしたい場合は、密度を72 * 2 = 144に設定します。

convert -density 144 source.svg target.png
14
Stanislav Schmidt

inkscapeコマンドラインを試してみませんか。これは、このディレクトリ内のすべてのsvgをpngに変換するための私のbatファイルです。

%% x IN（* .svg）C：¥Ink¥App¥Inkscape¥inkscape.exeの場合%% x -z --export-dpi = 500 --export-area-drawing --export-png = "％ ％〜nx.png "

7
ampecs

私はこの記事にたどり着きましたが、パラメータを使用せずにバッチですばやく変換したいと思いました（サイズが異なるいくつかのファイルがあるため）。

rsvg drawing.svg drawing.png

私にとっては、その要件はおそらく最初の作者よりも少し簡単でした。 （MS PowerPointでSVGを使用したいのですが、許可されていません）

4
Qohelet

ちょっと気にしたことの一つは、入力ファイル名の後に-densityを設定することでした。それはうまくいきませんでした。 convertの最初のオプションに移動すると（他の何よりも先に）動作しました（私にとっては、YMMVなど）。

2
Nick

この問題は、<svg>タグのwidthおよびheight属性を目的の出力サイズと一致するように変更してからImageMagickを使用して変換することで解決しました。魅力のように働きます。

これが私のPythonコード、JPGファイルの内容を返す関数です。

import gzip, re, os
from ynlib.files import ReadFromFile, WriteToFile
from ynlib.system import Execute
from xml.dom.minidom import parse, parseString


def SVGToJPGInMemory(svgPath, newWidth, backgroundColor):

    tempPath = os.path.join(self.rootFolder, 'data')
    fileNameRoot = 'temp_' + str(image.getID())

    if svgPath.lower().endswith('svgz'):
        svg = gzip.open(svgPath, 'rb').read()
    else:
        svg = ReadFromFile(svgPath)

    xmldoc = parseString(svg)

    width = float(xmldoc.getElementsByTagName("svg")[0].attributes['width'].value.split('px')[0])
    height = float(xmldoc.getElementsByTagName("svg")[0].attributes['height'].value.split('px')[0])

    newHeight = int(newWidth / width * height) 

    xmldoc.getElementsByTagName("svg")[0].attributes['width'].value = '%spx' % newWidth
    xmldoc.getElementsByTagName("svg")[0].attributes['height'].value = '%spx' % newHeight

    WriteToFile(os.path.join(tempPath, fileNameRoot + '.svg'), xmldoc.toxml())
    Execute('convert -background "%s" %s %s' % (backgroundColor, os.path.join(tempPath, fileNameRoot + '.svg'), os.path.join(tempPath, fileNameRoot + '.jpg')))

    jpg = open(os.path.join(tempPath, fileNameRoot + '.jpg'), 'rb').read()

    os.remove(os.path.join(tempPath, fileNameRoot + '.jpg'))
    os.remove(os.path.join(tempPath, fileNameRoot + '.svg'))

    return jpg
1
Yanone

単純なSVGからPNGへの変換では、cairosvg（ https://cairosvg.org/ ）がImageMagickよりも優れていることがわかりました。ディレクトリ内のすべてのSVGファイルをインストールして実行するための手順。

pip3 install cairosvg

あなたの.svgファイルを含むディレクトリでpythonシェルを開いて、実行してください：

import os

for file in os.listdir('.'):
    name = file.split('.svg')[0]
    cairosvg.svg2png(url=name+'.svg',write_to=name+'.png')

これにより、元の.svgファイルを上書きしないようにすることもできますが、同じ名前は保持されます。次のようにして、すべての.pngファイルを別のディレクトリに移動できます。

$ mv *.png [new directory]
1
edank

ImageMagickでは、InkscapeまたはRSVGをImageMagickと共に使用すると、独自の内部MSVG/XMLよりも優れたSVGレンダリングが得られます。 RSVGはImageMagickと共にインストールする必要があるデリゲートです。 Inkscapeがシステムにインストールされている場合、ImageMagickはそれを自動的に使用します。以下のImageMagickでInkscapeを使用します。

あなたが望むことをする「マジック」パラメータはありません。

しかし、出力をレンダリングするために必要な正確な密度を非常に簡単に計算できます。

デフォルトの密度96でレンダリングされた場合の小さな50x50ボタンは次のとおりです。

convert button.svg button1.png


enter image description here

出力を500にしたいとします。入力はデフォルトの密度96で50です（Inkscapeの古いバージョンは92を使用している可能性があります）。したがって、寸法と密度の比率に比例して必要な密度を計算できます。

512/50 = X/96
X = 96*512/50 = 983



convert -density 983 button.svg button2.png


enter image description here

ImageMagick 7では、次のようにインラインで計算を実行できます。

magick -density "%[fx:96*512/50]" button.svg button3.png

or

in_size=50
in_density=96
out_size=512

magick -density "%[fx:$in_density*$out_size/$in_size]" button.svg button3.png
1
fmw42

Librsvgがないと、黒いpng/jpegイメージが表示される場合があります。 imagemagickでlibrsvgからconvert svgファイルをインストールする必要があります。

Ubuntu

 Sudo apt-get install imagemagick librsvg
 convert -density 1200 test.svg test.png

マックOS

 brew install imagemagick librsvg
 convert -density 1200 test.svg test.png
0
TLbiz

@ 808soundによるトップの答えは私にはうまくいきませんでした。サイズを変更したい Kenney.nl UI Pack

そして得た Kenney UI Pack messed up

そのため、代わりにInkscapeを開いて、次にFile、Export as PNG fileに移動し、GUIボックスがポップアップして、必要な寸法を設定できるようにしました。

Ubuntu 16.04 Linux上のバージョン：Inkscape 0.91 (September 2016)

（この画像は Kenney.nlのアセットパック からのものです）

0
James L.