我如何更改snap.svg中的文本

Question

我在带有线条和文字的网站上绘制图形。我在使用JQuery的snap.svg。

s是绘图表面，g是ID为“ g54”的组。

g.add(s.text(120, 120, "outside").attr({    "font-size": "15px" }));

我想更改文本，我尝试了几种方法。我可以更改文本的位置，颜色，但不能更改文本本身。

$("#g54 text").attr({ x: 800, y: 700});
$("#g54 text").attr({ stroke: "red" });
$("#g54 text").attr({ text: "test", x: 800, y: 700 });//text doesn't work
$("#g54 text").attr({ innerHTML: "test" });   //innerHTML doesn't work
$("#g54 text").attr({ "innerHTML": "test" });   //innerHTML doesn't work

Answer 1

在快照中，文本属性应该起作用。

var t = s.text(120, 120, "outside").attr({ "font-size": "15px" })
g.add(t)
t.attr("text","changed")

您可以使用Snap（）方法引用Snap中现有的SVG元素。例如

Snap("#textelement").attr("text","changed")

所以您也可以尝试

Snap("#g54 text").attr("text","changed")

我不确定jquery是否可以与svg配合使用，因此最好直接使用Snap。

Answer 2

毕竟，Snap选择器对大多数文本项都执行了此操作，但是对于某些文本项却没有（我看不到原因）。因此，我再次使用JQuery尝试了以下操作。

JQuery("#g54").children().text("this is my text");