SVG圆圈，文字或线条上的可点击链接 [英] Clickable link on a SVG circle, text or line

问题描述

使用snapsvg.io，我想知道是否可以在SVG文本，圆圈或线条中添加可点击链接，例如<a href="somelink.com"/>My Link</a>标记.

Using snapsvg.io, I would like to know if it's possible to add a clickable link such as a <a href="somelink.com"/>My Link</a> tag to an SVG text, circle or line.

我在这里的一个示例是文本:

An example here I have is text:

var s = Snap("#svg");
var text = s.text(x + 10, y - 5, 'My Text');
text.attr({
        fill: doesExist ? alert : textColorOK,
        fontSize: '10px',
        'font-weight': '600',
        'font-family': 'Arial Narrow, sans-serif',
        'text-anchor': 'start',
        cursor: doesExist ? 'pointer' : 'default'
      });

我想用snapsvg.io做到这一点.此外，我想用普通的JavaScript而不是jQuery来做到这一点.

I'd like to do this with snapsvg.io. Furthermore, I want to do this in plain JavaScript, not jQuery.

推荐答案

赞赏响应，但最终使用click事件，例如对文本元素说

Appreciate the responses but ended up using a click event, say to a text element i.e.

text.click(function () {
    window.location.href = "http://stackoverflow.com/";
});

这篇关于SVG圆圈，文字或线条上的可点击链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！