gpt4 book ai didi

javascript - 动态更改 SVG 元素,

转载 作者:行者123 更新时间:2023-11-28 08:48:05 24 4
gpt4 key购买 nike

我有这个 HTML:

<span class="pop">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="200px" height="180px" viewBox="-18.25 -18.75 200 180" enable-background="new -18.25 -18.75 200 180" xml:space="preserve">
<text class="triangle-text" transform="matrix(1 0 0 1 63 -5.25)" font-family="'HelveticaNeue'" font-size="11">text</text>
<text class="triangle-text" transform="matrix(1 0 0 1 51 156.75)" font-family="'HelveticaNeue'" font-size="11">text1</text>
<text class="triangle-text" transform="matrix(1 0 0 1 -13.4998 77)" font-family="'HelveticaNeue'" font-size="11">text2</text>
<text class="triangle-text" transform="matrix(1 0 0 1 126 77)" font-family="'HelveticaNeue'" font-size="11">text3</text>
<g>
<polygon class="sl" fill="#F4f2f3" points="" />
</g>
</svg>
</span>

然后我从 js 准备另一个 SVG 内容,并使用 jquery 的 replaceWith() 替换原始的 SVG。它已被替换,如 Firebug 中所示,但不会显示在浏览器中。

我的JS:

   pop = '<svg xml:space="preserve" enable-background="new -18.25 -18.75 200 180" viewBox="-18.25 -18.75 200 180" height="180px" width="200px" y="0px" x="0px" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" version="1.1"><text haschanged="true" class="triangle-text" transform="matrix(1 0 0 1 63 -5.25)"  font-family="HelveticaNeue" font-size="11">Chiara</text>\n\
<text class="triangle-text" transform="matrix(1 0 0 1 51 156.75)" font-family="HelveticaNeue" font-size="11">Non chiara</text>\n\
<text class="triangle-text" transform="matrix(1 0 0 1 -13.4998 77)" font-family="HelveticaNeue" font-size="11"><tspan x="10" y="10">Non</tspan><tspan x="10" y="20">concordo</tspan></text>\n\
<text class = "triangle-text" transform = "matrix(1 0 0 1 -13.4998 77)" font - family = "HelveticaNeue" font - size = "11" >Concordo</text>\n\
<g>';
for (key in triangles) {
pop += '<polygon class = "sl" index = "' + key + '" understanding = "' + triangles[key].a + '" comprehension = "' + triangles[key].c + '" fill = "' + colors[resp.msg[key]] + '" points = "' + triangles[key].points + '" msg = "' + triangles[key].msg + '" />';
}
pop += '</g></svg>';

我像这样进行绑定(bind):

$('.pop').children('svg').replaceWith(pop);

我在论坛上浏览了与此相关的问题,但没有找到解决方案。

最佳答案

替换后尝试此操作:

$('.pop').html($('pop').html());

关于javascript - 动态更改 SVG 元素,,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19511129/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com