Question

我正在尝试将标记统一为一堆SVG图像。我的问题是我不能在标记定义中使用外部引用。它可能与问题How to reference external svg file in svg correctly?相关联，但仍然缺少某个链接。

我举了一个例子来证明我的问题：

b.svg（引用）：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
    <defs>
        <circle id="b" r="6" stroke="black" fill="green" />
        <marker id="b_end"
          orient="auto"
          style="overflow:visible">
            <use xlink:href="#b" />
        </marker>
    </defs>
</svg>

a.svg（试图引用b.svg）：

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
    <defs>
        <circle id="a" r="6" stroke="black" fill="yellow" />
        <marker id="a_end"
          orient="auto"
          style="overflow:visible">
            <use xlink:href="#a" />
        </marker>
        <marker id="b_end"
          orient="auto"
          style="overflow:visible">
            <use xlink:href="b.svg#b" />
        </marker>
    </defs>
    <path d="m 10,10 20,20" style="marker-end:url(#a_end)" stroke="black" />
    <path d="m 40,10 20,20" style="marker-end:url(#b_end)" stroke="black" />
    <path d="m 70,10 20,20" style="marker-end:url(b.svg#b_end)" stroke="black" />
</svg>

正如您所看到的，我通过内部id引用了第一行的标记（实际上是两个，因为标记也有引用）。这很好。

我使用内部标记定义和第二行的外部路径。它不起作用。（线是显示的，标记不是。）

我在第三行使用了外部标记。它也不起作用。

问题可能是外部内容不在托管DOM中 - 至少在样式中的引用被解析时不会。

好的，但我该怎么办呢？如何在SVG中引用标记的外部元素？

Answer 1

我想我可以根据我的实验和Robert留下的评论来回答我原来的问题。

我写的代码应该在SVG中工作，与Opera和Firefox一起工作。此外，它适用于使用Apache FOP生成PDF，这对我来说是关键点。

唯一的问题是外部参考在IE，Chrome和Safari中无效。我不确定何时在Firefox中实现了样式定义的外部引用：它在7.0中不起作用，但在11中工作。

外部定义的标记不会出现在SVG中

1 个答案: