如何使用 jQuery 更改 Raphael 文本元素？

发布于 2024-12-11 18:51:10 字数 784 浏览 0 评论 0原文

我创建了一个文本元素：

var gcText = paper.text(textPosX, textPosY, "myText");
gcText.attr({"text-anchor":end});
gcText.node.id = "myObject";

加载页面后，我使用一些 JS jQuery 命令来修改一些元素，并且我还想更新文本。我已经找到这些帖子：如何修改 raphael 文本？和更改 RaphaelJS 中的文本 ...并尝试了这个：

$('#myObject').attr("text","new text");

但没有运气！这些命令更改 svg-text 元素内的文本属性，但不会更改我在页面上看到的文本。现在我发现生成的 SVG 中有一个 tspan 元素：

<text id="myObject" [...] text="new text"><tspan dy="3.5">myText</tspan></text>

我只能看到“myText”，而看不到文本属性中的文本（“新文本”）。如何通过 jQuery 命令更改此文本？

原文

I created a text element:

var gcText = paper.text(textPosX, textPosY, "myText");
gcText.attr({"text-anchor":end});
gcText.node.id = "myObject";

After loading the page I use some JS jQuery commands for modifying some elements and I also want to update the text. I already found these posts:
How to modify raphael text? and
Changing text in RaphaelJS
... and tried this:

$('#myObject').attr("text","new text");

But had no luck with it! These commands change the text attribute inside the svg-text element, but not the text I can see on the page. Now I found out that there is a tspan-element inside the generated SVG:

<text id="myObject" [...] text="new text"><tspan dy="3.5">myText</tspan></text>

I can only see the "myText" and not the text from the text-attribute ("new text").
How can a change this text through jQuery commands?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

风为裳 2024-12-18 18:51:10

您可能应该尝试引用 Raphael 对象本身，而不是使用 jQuery。 jQuery 非常适合 DOM 操作，包括 DIV、A、P 等元素。Raphael

的 API 更适合操作 SVG。

这是一个类似的问题，其中包含您问题的适当答案：

如何修改 raphael 文本？

编辑：代码重写示例：

function renderText(myText) {
    var gcText = paper.text(textPosX, textPosY, myText).attr({"text-anchor":end});
    gcText.node.id = "myObject";
}
//onload
renderText("First text to appear");

// call it second time
renderText("Second text to appear");

它不会完全更改 SVG 内的文本，而是重写它。但你会得到同样的效果。

You should probably attempt to reference the Raphael object itself, not using jQuery. jQuery is great for DOM manipulation, with elements such as DIV, A, P, etc.

Raphael's API is much better suited for manipulating SVG.

Here is a similar question with the appropriate answer to your question:

How to modify raphael text?

Edit: Sample Rewrite of code:

function renderText(myText) {
    var gcText = paper.text(textPosX, textPosY, myText).attr({"text-anchor":end});
    gcText.node.id = "myObject";
}
//onload
renderText("First text to appear");

// call it second time
renderText("Second text to appear");

It doesn't EXACTLY change the text inside the SVG, rather it rewrites it. But you get the same effect.

回复收藏 0 原文

~没有更多了~