如何在保持宽高比但改变范围的同时将SVG转换为PNG？

Question

我试图将SVG转换为PNG。 SVG是非方形矩形。我希望图像的宽高比保持不变，因此需要填充图像的范围（透明）。

我在OS X Mavericks上，10.9.2。

我用3个工具尝试了这个，每个工具都有问题：

使用ImageMagick：

convert -background none -resize 200x200 -gravity center -extent 200x200 rect.svg rect-imagemagick.png 

开始 -

结束 -

图像是正方形，具有正确的宽高比，但模糊不清。我已经看到其他用户使用imagemagick将SVG转换为PNG来报告此问题。我已经升级了imagemagick以使用rsvg（通过brew），可以在下面版本的代表中看到。

版本：

# convert --version
Version: ImageMagick 6.9.1-3 Q16 x86_64 2016-01-23 http://www.imagemagick.org
Copyright: Copyright (C) 1999-2015 ImageMagick Studio LLC
License: http://www.imagemagick.org/script/license.php
Features: DPC Modules
Delegates (built-in): bzlib cairo fontconfig freetype jng jpeg ltdl lzma png rsvg tiff xml zlib

使用rsvg：

rsvg-convert -a -w 200 -h 200 rect.svg > rect-rsvg.png

开始 -

结束 -

图像清晰，正确的宽高比，但我没有看到使其成为正方形的方法（扩展图像）。

版本：

# rsvg-convert --version
rsvg-convert version 2.40.9

使用Inkscape：

inkscape -z -e rect-inkscape.png -w 200 -h 200 rect.svg

开始 -

结束 -

图像方形清晰，但宽高比不正确。

版本：

# inkscape --version
W: AppleCollationOrder setting not found, using AppleLocale.
Setting LANGSTR from AppleLocale: en
Overriding empty LANG from /usr/share/locale/locale.alias
Setting Language: en_US.UTF-8
Inkscape 0.48.5 r10040 (Jul 12 2014)

Answer 1

好吧，如果我将两个实用程序结合起来，我意识到这有一个简单的答案：

<div ng-click="setNow(thisDate)">
    {{thisDate | date : 'hh:mm:ss'}}
</div>

<div ng-click="setNow(thisOtherDate)">
    {{thisOtherDate | date : 'hh:mm:ss'}}
</div>

<input type="text" ng-model="Task.StartDate" ng-blur="setNow(Task.StartDate)" >
<input type="text" ng-model="Task.EndDate" ng-blur="setNow(Task.EndDate)" >

首先使用rsvg-convert -a -w 200 -h 200 rect.svg > rect-rsvg.png convert -background none -resize 200x200 -gravity center -extent 200x200 rect-rsvg.png rect-correct.png 转换为PNG，正确转换但不会扩展。然后将imagemagick从PNG扩展到PNG。