1

我遇到了带有笔画的 SVG 形状的问题，并试图让它们在 Firefox 中打印。

这是最简单的例子：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink">
    <rect x="0" y="0" rx="15" ry="15" width="300" height="400" style="stroke:black;stroke-width:5;" fill="black" />
    <circle id="FirstCircle" cx="50" cy="50" r="30" stroke="black" stroke-width="2" fill="white" style="opacity:0.75;"/>
    <circle id="SecondCircle" cx="50" cy="150" r="30" fill="white" style="opacity:0.75;"/>
</svg>

当我尝试打印这个时，第一个形状会做两件事之一：

  1. 它根本不显示
  2. 它在其边界框中显示为偏离中心。

没有笔划的第二个形状按预期显示，如预期的那样。

在屏幕上显示时，它会按预期显示。当我尝试打印时，问题就出现了。

我尝试了不同的比例因子（50% - 100%）和默认缩小以适应。

这是我尝试打印时得到的结果：

图像输出

这是定义的行为还是有人知道如何纠正这个问题？

我不喜欢这种形状的笔触，并且可以轻松地对形状进行分层以获得相同的效果，但很高兴知道为什么会发生这种情况。

编辑：

正如 Robert Longson 指出的，这似乎是一个 Firefox 错误。在这里提交了一份报告，他们正在调查它。

4

1 回答 1

1

You need to specify the width and height of the svg element to fix this:

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="300" height="400">
    <rect x="0" y="0" rx="15" ry="15" width="300" height="400" style="stroke:black;stroke-width:5;" fill="black" />
    <circle id="FirstCircle" cx="50" cy="50" r="30" stroke="black" stroke-width="2" fill="white" style="opacity:0.75;"/>
    <circle id="SecondCircle" cx="50" cy="150" r="30" fill="white" style="opacity:0.75;"/>
</svg>
于 2013-07-18T06:09:10.490 回答