如何获取SVG折线元素的高度和宽度？

Question

<g class="new class" id="polyline" style="pointer-events: inherit;" opacity="1">
  <polyline id="svg_43" points="268.4,469.4 230.3,469.4 230.3,431.3 268.4,431.3 268.4,469.4" />
</g>

我们如何知道JavaScript中svg折线元素的高度和宽度？

Answer 1

您必须像下面这样使用函数getBBox()（这是SVG 1.1的一部分）：

var polylineBBox = document.querySelector('polyline').getBBox();
console.log(polylineBBox.width);
console.log(polylineBBox.height);

<svg width="100" height="100" viewBox="0 0 100 100">
    <g class="new-class" style="fill:#6c0">
        <polyline points="69, 69
                        30, 69
                        30, 30
                        69, 30
                        69, 69"/>
    </g>
</svg>