D3.js:如何获得任意元素的计算宽度和高度?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (45)

我需要知道我的任意g元素的宽度和高度,SVG因为我需要在用户单击它时在其周围绘制选择标记。

我在互联网上看到的东西是这样的:d3.select("myG").style("width")。问题是元素不会总是有明确的宽度属性集。例如,当我在里面创建一个圆时g,它将具有radious(r)集而不是宽度。即使我window.getComputedStyle在a上使用该方法circle,它也会返回“auto”。

有没有办法计算任意svg元素的宽度D3

谢谢。

提问于
用户回答回答于

对于SVG元素

使用像selection.node().getBBox()

{
    height: 5, 
    width: 5, 
    y: 50, 
    x: 20
} 

对于HTML元素

使用 selection.node().getBoundingClientRect()

用户回答回答于

.get1244 ingClientRect()返回元素的大小及其相对于视图的位置。

  • 左,右
  • 顶部,底部
  • 高度,宽度

例子:

var element = d3.select('.elementClassName').node();
element.getBoundingClientRect().width;

扫码关注云+社区