development

ImageMagick을 사용하여 SVG를 PNG로 변환하는 방법은 무엇입니까?

big-blog 2020. 3. 1. 15:58
반응형

ImageMagick을 사용하여 SVG를 PNG로 변환하는 방법은 무엇입니까?


16x16 크기로 정의 된 SVG 파일이 있습니다. ImageMagick의 변환 프로그램을 사용하여 PNG로 변환하면 너무 작은 16x16 픽셀 PNG가 나타납니다.

convert test.svg test.png

출력 PNG의 픽셀 크기를 지정해야합니다. -size매개 변수는 무시 될 것으로 보인다 -scale매개 변수는 PNG를 조정 한 후 이 PNG로 변환되었습니다. 지금까지 가장 좋은 결과는 -density매개 변수 를 사용하여 얻은 것입니다 .

convert -density 1200 test.svg test.png

그러나 밀도 값을 계산하기 위해 수학을 수행하지 않고 출력 크기를 픽셀 단위로 지정하려고하기 때문에 만족스럽지 않습니다. 그래서 나는 이런 식으로하고 싶다 :

convert -setTheOutputSizeOfThePng 1024x1024 test.svg test.png

여기서 사용해야 할 마법 매개 변수는 무엇입니까?


이 경우 ImageMagick에서 좋은 결과를 얻을 수 없었지만 Inkscape는 Linux 및 Windows에서 훌륭하게 작동합니다.

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

이 명령을 사용하여 16x16 SVG를 200x200 PNG로 스케일링 한 결과는 다음과 같습니다.

여기에 이미지 설명을 입력하십시오

여기에 이미지 설명을 입력하십시오

참고로, 내 Inkscape 버전 (Ubuntu 12.04)은 다음과 같습니다.

Inkscape 0.48.3.1 r9886 (Mar 29 2012)

Windows 7에서는 다음과 같습니다.

Inkscape 0.48.4 r9939 (Dec 17 2012)

svgexport를 사용해보십시오 :

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

svgexport는 svg 파일을 jpg 및 png로 내보내기 위해 만든 간단한 크로스 플랫폼 명령 줄 도구입니다 . 자세한 옵션 여기참조 하십시오 . svgexport install npm 을 설치하려면 다음을 실행하십시오.

npm install svgexport -g

편집 : 라이브러리에 문제가 있으면 GitHub에 제출하십시오 . 감사합니다!


이것은 완벽하지는 않지만 작업을 수행합니다.

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

기본적으로 크기 조정이 적절한 품질로 수행 될 수있을 정도로 DPI를 충분히 높입니다 (교육받은 / 안전한 추측 만 사용). 나는 이것에 대한 적절한 해결책을 찾으려고 노력했지만 잠시 후 이것이 현재의 필요에 충분하다고 결정했습니다.

참고 : 200x200을 사용하십시오! 주어진 해상도를 강제로


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.


svg 단위가 아닌 경우 px(예 : cm) 잉크 스케이프가 작동하지 않는 것 같습니다 . 빈 이미지가 있습니다. 아마도 dpi를 꼬집어 고칠 수도 있지만 너무 번거로 웠습니다.

Svgexport는 node.js 프로그램이므로 일반적으로 유용하지 않습니다.

Imagemagick의 변환은 다음과 함께 작동합니다.

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

을 사용 -resize하면 이미지가 흐리고 파일이 훨씬 큽니다.

베스트

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

가장 빠르며 종속성이 가장 적으며 출력은 변환보다 약 30 % 작습니다. librsvg2-bin을 설치하십시오. 매뉴얼 페이지는 없지만 다음을 입력 할 수 있습니다.

~$ rsvg --help

도움을받을 수 있습니다. 간단합니다.


Jose Alban 's answer 의 단계를 수행 한 후 다음 명령을 사용하여 ImageMagick이 제대로 작동하도록 할 수있었습니다.

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

숫자 1536은 밀도에 대한 야구장 추정치에서 나온 입니다. 자세한 내용 이 답변 을 참조하십시오.


이미지의 크기를 조정하려면 옵션을 -density사용해야합니다. 내가 아는 한 표준 밀도는 72이고 크기는 1 : 1입니다. 출력 png를 원본 svg의 두 배보다 크게하려면 밀도를 72 * 2 = 144로 설정하십시오.

convert -density 144 source.svg target.png

왜 inkscape 명령 행을 시도하지 않습니까?이 디렉토리의 모든 svg를 png로 변환하는 박쥐 파일입니다.

%% x IN (* .svg) DO C : \ Ink \ App \ Inkscape \ inkscape.exe %% x -z --export-dpi = 500 --export-area-drawing --export-png = "% % ~ nx.png "


이 게시물에 왔지만 매개 변수를 사용하지 않고 (크기가 다른 여러 파일로 인해) 일괄 처리로 빠르게 변환하고 싶었습니다.

rsvg drawing.svg drawing.png

나에게 요구 사항은 아마도 원래 저자보다 약간 쉬웠을 것이다. (MS PowerPoint에서 SVG를 사용하고 싶지만 허용하지 않습니다)


나를 -density물린 한 가지는 입력 파일 이름 후에 설정하는 것이 었습니다 . 작동하지 않았습니다. 변환 (첫 번째, YMMV 등)에서 변환의 첫 번째 옵션으로 옮기면 작동합니다.


의도 한 출력 크기와 일치하도록 태그 widthheight속성 을 변경 <svg>한 다음 ImageMagick을 사용하여 변환 하여이 문제를 해결 했습니다. 매력처럼 작동합니다.

다음은 JPG 파일의 내용을 반환하는 함수 인 Python 코드입니다.

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

간단한 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]

librsvg가 없으면 검은 색 png / jpeg 이미지가 나타날 수 있습니다. imagemagick 를 사용 librsvg하여 convertsvg 파일 에 설치해야 합니다 .

우분투

 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


ImageMagick에서는 자체 내부 MSVG / XML 렌더링보다 ImageMagick과 함께 Inkscape 또는 RSVG를 사용하는 경우 더 나은 SVG 렌더링을 얻을 수 있습니다. RSVG는 ImageMagick과 함께 설치해야하는 대리인입니다. 시스템에 Inkscape가 설치되어 있으면 ImageMagick이 자동으로 사용합니다. 아래 ImageMagick에서 Inkscape를 사용합니다.

원하는 것을 수행 할 "매직"매개 변수가 없습니다.

그러나 출력을 렌더링하는 데 필요한 정확한 밀도를 매우 간단하게 계산할 수 있습니다.

기본 밀도 96으로 렌더링 할 때 작은 50x50 버튼은 다음과 같습니다.

convert button.svg button1.png


여기에 이미지 설명을 입력하십시오

출력이 500이 되길 원한다고 가정합니다. 기본 밀도가 96 인 경우 입력이 50입니다 (이전 버전의 Inkscape는 92를 사용할 수 있음). 따라서 치수와 밀도의 비율에 비례하여 필요한 밀도를 계산할 수 있습니다.

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


convert -density 983 button.svg button2.png


여기에 이미지 설명을 입력하십시오

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

@ 808sound의 최고 답변은 저에게 효과적이지 않았습니다. 나는 크기를 조정하고 싶었다Kenney.nl UI 팩

그리고 얻었다 케니 UI 팩 엉망

그래서 그 대신 나는 그 때, 잉크 스케이프를 열어 갔던 File, Export as PNG file그리고 GUI 상자가 제가 필요로하는 정확한 크기를 설정할 수 있다는 팝업.

에 버전 Ubuntu 16.04 Linux:Inkscape 0.91 (September 2016)

(이 이미지는 Kenney.nl의 자산 팩 에서 가져온 것입니다)

참고 URL : https://stackoverflow.com/questions/9853325/how-to-convert-a-svg-to-a-png-with-imagemagick



반응형