外部定义的标记不会出现在SVG中 [英] Externally defined markers don't appear in SVG

问题描述

我正在尝试使一堆SVG图像的标记统一.我的问题是我无法使标记定义中的外部引用起作用.它可能与问题有关如何在svg中引用外部svg文件正确吗?，但是仍然缺少链接.

I'm trying to make the markers unified for a bunch of SVG images. My problem is that I cannot make external references in marker definitions work. It may be connected to question How to reference external svg file in svg correctly? but a link is still missing.

我举了一个小例子来说明我的问题:

I made a little example to demonstrate my problem:

b.svg(已引用):

b.svg (which is referenced):

<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):

a.svg (trying to reference 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引用了第一行的标记(实际上也是两个，因为标记也具有引用).效果很好.

As you can see, I referenced the marker for the first line via an internal id (actually two since the marker has a reference, too). This works fine.

我在第二行中使用了内部标记定义和外部路径.它不起作用. (该行已显示，标记未显示.)

I used an internal marker definition with an external path for the second line. It doesn't work. (The line is diplayed, the marker isn't.)

我在第三行中使用了外部标记.也不行.

I used an external marker in the third line. It doesn't work either.

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

The problem may be that the external content isn't in the hosting DOM - at least not when the reference in the style is resolved.

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

OK, but what can I do about it? How can I reference external elements for markers in SVG?

推荐答案

我认为我可以根据自己的实验和罗伯特(Robert)的评论回答我的原始问题.

I think I can answer my original question based on my experiments and on the comment left by Robert.

我编写的代码应该在SVG中有效，并且确实在Opera和Firefox中有效.另外，当我用Apache FOP生成PDF时，它也可以工作.

The code I wrote should work in SVG and it does work with Opera and Firefox. Plus it works when generating a PDF with Apache FOP which was the key point for me.

唯一的问题是外部引用在IE，Chrome和Safari中不起作用.我不确定何时在Firefox中实现样式定义的外部引用:它在7.0中不起作用，但在11中起作用.

The only problem is that external referencing doesn't work in IE, Chrome and Safari. I'm not sure when external references from style definitions were implemented in Firefox: it doesn't work in 7.0 but it works in 11.

这篇关于外部定义的标记不会出现在SVG中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！