Imagemagick SVG转换为PDF转换图像质量很差

Question

我们正在尝试将SVG（宽度737，高度521）转换为A4尺寸的PDF。问题是生成的图像质量非常差。

这就是我们正在做的事情

SVG（带有远程图像URL）：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="737" height="521">
    <g class="background">
        <title>Background</title>
        <image x="0" y="0" width="737" height="521" id="svg_1" xlink:href="http://static.inkive.com/assets/img/backgrounds/default.svg"/>
    </g><g class="main">
        <title>Main</title>
        <image id="svg_2" clip-path="url(#clip_svg_2)" class="layoutBox" height="146" width="195" y="185" x="112" xlink:href="https://fbcdn-sphotos-c-a.akamaihd.net/hphotos-ak-ash3/t1/1779720_10153782785350029_1577015767_n.jpg">112 185 195 146</image>
        <image id="svg_3" clip-path="url(#clip_svg_3)" class="layoutBox" height="146" width="195" y="342" x="112" xlink:href="https://scontent-b.xx.fbcdn.net/hphotos-frc3/t1/1526323_10153667389170029_829908430_n.jpg">112 342 195 146</image>
        <image id="svg_4" clip-path="url(#clip_svg_4)" class="layoutBox" height="146" width="195" y="28" x="112" xlink:href="https://scontent-b.xx.fbcdn.net/hphotos-prn1/t1/1522194_10153655638625029_2110669828_n.jpg">112 28 195 146</image>
        <image id="svg_5" clip-path="url(#clip_svg_5)" class="layoutBox" height="222" width="296" y="28" x="323" xlink:href="https://scontent-a.xx.fbcdn.net/hphotos-prn2/t1/1157459_10153637913840029_1004079041_n.jpg">323 28 296 222</image>
        <image id="svg_6" clip-path="url(#clip_svg_6)" class="layoutBox" height="222" width="296" y="266" x="323" xlink:href="https://scontent-a.xx.fbcdn.net/hphotos-frc3/t1/996689_10153637905215029_532085859_n.jpg">323 266 296 222</image>
    </g>
</svg>

我们正在下载图像并创建一个带有本地链接的SVG，因为imagemagick的SVG到PDF转换失败，带有远程URL。这是带有本地链接的SVG-

<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="737" height="521">
    <g class="background">
        <title>Background</title>
        <image x="0" y="0" width="737" height="521" id="svg_1" xlink:href="file:///tmp/119810194_default.svg"/>
    </g><g class="main">
        <title>Main</title>
        <image id="svg_2" clip-path="url(#clip_svg_2)" class="layoutBox" height="146" width="195" y="185" x="112" xlink:href="file:///tmp/119810194_1779720_10153782785350029_1577015767_n.jpg">112 185 195 146</image>
        <image id="svg_3" clip-path="url(#clip_svg_3)" class="layoutBox" height="146" width="195" y="342" x="112" xlink:href="file:///tmp/119810194_1526323_10153667389170029_829908430_n.jpg">112 342 195 146</image>
        <image id="svg_4" clip-path="url(#clip_svg_4)" class="layoutBox" height="146" width="195" y="28" x="112" xlink:href="file:///tmp/119810194_1522194_10153655638625029_2110669828_n.jpg">112 28 195 146</image>
        <image id="svg_5" clip-path="url(#clip_svg_5)" class="layoutBox" height="222" width="296" y="28" x="323" xlink:href="file:///tmp/119810194_1157459_10153637913840029_1004079041_n.jpg">323 28 296 222</image>
        <image id="svg_6" clip-path="url(#clip_svg_6)" class="layoutBox" height="222" width="296" y="266" x="323" xlink:href="file:///tmp/119810194_996689_10153637905215029_532085859_n.jpg">323 266 296 222</image>
    </g>
</svg>

我们将此SVG保存到文件并运行以下命令：

convert -density 600 /var/www/development/assets/img/uploads/119810194_1.svg -resize 3508x2480 /var/www/development/assets/img/uploads/119810194_1.pdf

Output

如您所见，输出PDF中的图像质量非常差。

谁能帮我这个？需要做些什么来生成具有更好图像的72 DPI和300 DPI PDF？

我们也尝试使用PHP，使用setResolution（300,300）但结果是一样的。

Answer 1

你不应该使用-resize，因为这将在光栅化后完成。您必须计算正确的密度值（使用72dpi作为基础）。然后你可以-crop如果宽高比不适合你的A4纸。

A4纸的尺寸为8.27 * 11.7英寸。使用300 dpi时，长边是11.7 * 300（3510）点，是原始尺寸（3510/737）的4.76倍。在解码时，你必须将密度乘以这么多。将默认值72乘以4.76将得到343。

convert -density 343 in.svg out.pdf

这应该给你合适的尺寸。

Answer 2

五年后...

有同样的问题，不想光栅化svg（以确保最好的质量），我最终使用CairoSVG：

cairosvg example.svg -o example.pdf