SVG和DPI，绝对单位和用户单位：Inkscape vs. Firefox vs. ImageMagick

Question

我尝试自动生成一个打印在特定尺寸（A4）上的SVG文件。我希望在其中使用一个路径，它只允许“用户单位”，而不是“绝对单位”。

在我看来，无法“发布”具有绝对单位（例如文档大小）和路径的SVG文件，因为我无法让它在整个查看器中正常工作。

有没有办法在渲染中获得一些一致性，比如指定'默认DPI'？

或者换一种说法：我可以在下面看到我的例子，在不放弃绝对单位的情况下在所有观众中呈现相同的内容吗？

相关：有没有办法强制下面的任何应用程序以与其他应用程序相同的方式呈现图像？ （例如，我尝试了'convert'的-density选项，但我无法将输出与Inkscape或Firefox的输出相匹配。）

---

示例：

我创建了一个SVG文件，其中三个黑色方块（rect）带有红色对角线（路径）：

• 左：用户单位的方形和对角线
• 中：正方形和对角线的英寸（在我看来是最合乎逻辑的选择，但不允许）
• 右：mm的平方，用户单位的对角线

在不同的观看者中呈现的方式不同：

• Inkscape：90 DPI，所有方块大小相同，红色对角线匹配
• Firefox：96 DPI？，后面的方块为大（或从对角线到短）
• 转换：72 DPI，后者正方形为小（或从对角线到长）

Code：

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
   xmlns:svg="http://www.w3.org/2000/svg"
   xmlns="http://www.w3.org/2000/svg"
   version="1.1"
   width="200mm"
   height="100mm"
   >
  <g transform="translate(50,50)">
    <rect
       width="100."
       height="100."
       x="10"
       y="10" />
    <path style="stroke: #ff0000" d="M 10 10 L 110 110" />
  </g>
  <g transform="translate(200,50)">
    <rect
       width="1.111in"
       height="1.111in"
       x="0.1111in"
       y="0.1111in" />
    <path style="stroke: #ff0000" d="M 0.1111in 0.1111in L 1.111in 1.111in" />
  </g>
  <g transform="translate(350,50)">
    <rect
       width="1.111in"
       height="1.111in"
       x="0.1111in"
       y="0.1111in" />
    <path style="stroke: #ff0000" d="M 10 10 L 110 110" />
  </g>
</svg>

Inkscape（我的默认“查看者”）：

Firefox（请注意，红线没有到达右下角。我制作了截图并随意裁剪）：

ImageMagick（转换，除了给出的文件名之外没有选项）：

Answer 1

路径 标记中的所有维度均以用户单位显示。

您无法在 路径 标记内指定绝对单位，这就是中间方格中的路径无法渲染的原因。

我发现最简单的方法是使用 viewbox 设置单位：

• 设置宽度和宽度高度以英寸为单位。
• 然后将视图框设置为相同。
• 这会将用户单位设置为1英寸。
• 然后以英寸为单位指定所有尺寸（注意：我在路径标签中使用小写l来指定相对移动）

这在Inkscape和Firefox中正确显示。

<svg
    xmlns:svg="http://www.w3.org/2000/svg"
    xmlns="http://www.w3.org/2000/svg"
    version="1.1"
    width="8in"
    height="4in"
    viewBox="0 0 8 4">

    <g transform="translate(4,0.5)">
        <rect
            width="1.111"
            height="1.111"
            x="0.1111"
            y="0.1111" />
        <path d="M 0.1111,0.1111 l 1.111 1.111" style="stroke: #ff0000;stroke-width:0.01"  />
    </g>
</svg>

Answer 2

我使用Apache Batik使用iText将SVG文件嵌入到PDF文件中时遇到了类似的问题。 iText使用72 DPI，PDF的标准，而Batik使用96。

要使图像正确显示，即缩放，在PDF文件中，您需要将SVG标题中的width = x cm height = y cm除以1.33（96/72）。