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

Question

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

在我看来，不可能在任何地方“发布”具有绝对单位(例如文档大小)和路径的 SVG 文件，因为我无法让它在查看器中正常工作。

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

或者换一种说法:我可以在下面的示例中在所有查看器中呈现相同的效果而根本不放弃绝对单位吗？

相关:有没有办法强制以下任何应用程序以与其他应用程序相同的方式渲染图像？ (例如，我尝试了“转换”的 -density 选项，但我无法获得与 Inkscape 或 Firefox 输出匹配的输出。)

例子:

我创建了一个 SVG 文件，其中包含三个带有红色对角线(路径)的黑色方块(矩形):

左:用户单位中的正方形和对角线

中间:以英寸为单位的正方形和对角线(在我看来是最合乎逻辑的选择，但不允许)

右:以毫米为单位的正方形，以用户单位为单位的对角线

在不同的查看器中呈现不同的效果:

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(我的默认“查看器”):



火狐(注意红线没到右下角，我截了图，随意裁剪):



ImageMagick(转换，除了给定的文件名之外没有其他选项):

Answer 1

中的所有尺寸路径 标签以用户为单位。

您不能在 中指定绝对单位路径 标签，这就是为什么中间方块中的路径不呈现的原因。

我发现的最简单的方法是使用 设置单位视窗 :

以英寸为单位设置宽度和高度。

然后将 View 框设置为相同。

这将用户单位设置为一英寸。

然后以英寸为单位指定所有尺寸(注意:我在路径标记中使用小写 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>