Я делаю рисунок на сайте с линиями и текстом. я использую snap.svg en JQuery.

S - поверхность рисования, g группа с идентификатором "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
1
Jan Van den Bossche 25 Окт 2019 в 16:41

2 ответа

Лучший ответ

В Snap, текстовый атрибут должен работать.

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

Вы можете ссылаться на существующие элементы SVG в Snap с помощью метода Snap (). Например

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

Так что вы также можете попробовать

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

Я не уверен, что jquery работает правильно с svg, поэтому лучше использовать Snap direct.

0
Ian 26 Окт 2019 в 10:05

В конце концов, селектор Snap сделал это для большинства текстовых элементов, но для некоторых - нет (я не мог понять, почему). Поэтому я пробую это снова с JQuery, и следующее работает.

JQuery("#g54").children().text("this is my text");
0
Jan Van den Bossche 1 Ноя 2019 в 10:29