使用 snapsvg.io,我想知道是否可以像使用 <img>
一样向 SVG 圆圈添加标题。将鼠标悬停在图像上但在 SVG 圆圈上时标记?
使用来自 snapsvg.io 网站的一些示例代码:
var s = Snap("#svg");
var bigCircle = s.circle(150, 150, 100);
bigCircle.attr({
fill: "#bada55",
stroke: "#000",
strokeWidth: 5
});
如何在这个 bigCircle 上实现悬停标题以显示一些标题文本?我想用纯 JavaScript 来完成。
最佳答案
您可以只创建圆圈的标题子项。没有快照标题创建器,但您可以使用 Snap.parse 在本地创建一个。
var s = Snap("#svg");
var bigCircle = s.circle(150, 150, 100);
bigCircle.attr({
fill: "#bada55",
stroke: "#000",
strokeWidth: 5
});
var title = Snap.parse('<title>This is a title</title>');
bigCircle.append(title);
html, body, svg {
width: 100%;
height: 100%;
}
<script src="http://svg.dabbles.info/snap.svg.js"></script>
<svg id="svg"></svg>
关于javascript - 将标题悬停在 SVG 圆上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37540180/