如何获取 svg:g 元素的宽度 [英] How to get the width of an svg:g element
问题描述
我目前正在使用 JavaScript 中的 svg
元素.我是新手.
I am currently working with an svg
element in JavaScript. And I am new to this.
我的问题是我有一个 svg
元素,其中有多个 svg:g
元素.在我的 svg:g
元素中,我还有其他各种 svg 元素.
My question is that I have an svg
element in which I have multiple svg:g
elements. And in my svg:g
elements I have various other svg elements.
<svg>
<g class="my-class">
<g class "c1">
<text style="font-size: 9" x="0" y="-4"> john </text>
<text style="font-size: 9" x="70" y="-4"> 13 </text>
</g>
<g class="c2">
<text style="font-size: 9" x="0" y="-4"> john </text>
<text style="font-size: 9" x="70" y="-4"> 13 </text>
</g>
<g class="c3">
<text style="font-size: 9" x="0" y="-4"> john </text>
<text style="font-size: 9" x="70" y="-4"> 13 </text>
</g>
</g>
</svg>
g
动态附加到我的
g "my_class"
g "my_class"
现在我想将我的 svg
宽度设置为等于 g.my_class
宽度的宽度.
Now I want to set my svg
width equal to the width of g.my_class
width.
var svgWidth = $('.my-class').width()
alert(svgWidth);
但它给了我零.我怎么能在我的浏览器的黄色工具提示框中看到它
But its giving me zero. How ever I can see it on my browser in a yellow tool tip box
当我选择这一行时.
有好心人指导一下吗?我这样做对吗,或者我怎样才能做到这一点?谢谢
Can anyone kindly guide me? Am I doing this right, or how can I achieve this? Thanks
推荐答案
Try .getBoundingClientRect
$('.my-class')[0].getBoundingClientRect().width;
这篇关于如何获取 svg:g 元素的宽度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!