SVG链接存在，但没有被链接化

Question

谁能告诉我为什么我的SVG链接没有被链接?标记出现了，并包装了文本节点，但没有任何效果。SVG的代码片段如下:

<a xlink:href="http://www.abcharts.net">
  <text x="600" y="250" fill="black" text-anchor="end" style="font-family: Arial; font-size: 8pt">abcharts.net</text>
</a>

如果你愿意，你可以在这里看到它的作用:

http://abcharts.net

Answer 1

abcharts包含如下函数:

//
// Create an SVG object
//
AB.create = function (args)
{
    var el = document.createElementNS('http://www.w3.org/2000/svg', args.tag);
    for (var i in args.attrs) {
        if (typeof i === 'string') {
            el.setAttribute(i, args.attrs[i]);
        }
    }
    args.object.svg.appendChild(el);
    return el;
};

这只能在空命名空间中创建对象(因为它使用setAttribute而不是setAttributeNS)。

当这个函数被传递给xlink:href属性时，它没有，因此正确创建它以使链接不起作用。

设置xlink:href属性的正确方法是

el.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', attrs[i]);

Answer 2

Khanh TO是对的，需要一个svg标签。这是一个工作版本。

<svg>
<a xlink:href="http://www.abcharts.net">
  <text x="10" y="20" fill="black" text-anchor="end" style="font-family: Arial; font-size: 8pt">abcharts.net</text>
</a>
</svg>