Question

我正在尝试更改SVG中文本元素的内容。这样做的目的是动态更新将显示为文本元素的对象的模式。

我将text元素包含在元素中，如下所示：

<g id="CarAMode">
   <text transform="matrix(1 0 0 1 177.17 133.6)" class="st2">PASSENGER</text>
</g>

然后我在加载时将JS加载到JS中：

var hoistShaft = Snap('#HoistShaft');

Snap.load( "/svg/Hoistway.svg", function(f) {
   hoistShaft.append(f);
   var carMode = hoistShaft.select('#CarAMode');

   carMode.attr({       // I thought this is how its done..
      text: 'default'
   });
}

加载我的页面后，我希望'PASSENGER'成为'默认'，但不会发生任何变化。我也没有在控制台中得到任何错误，所以语法似乎是正确的。

有关如何更改文本元素的任何帮助吗？

Answer 1

给定 svg 代码，如注释中所述，您可以使用常见的 CSS 选择查询进行选择：
hoistShaft.select('#CarAMode text'); 要么 hoistShaft.select('#CarAMode').select('text');

如何使用Snap.svg更改文本元素内容

1 个答案: