找到svg形状的中心

Question

我使用svgjs来创建我的形状。 如何找到svg形状的中心点并在那里添加元素？ 在我的情况下，一个红点。 我在文档的文档中找不到任何有助于这种情况的信息。

Answer 1

您可以使用方法getBBox或getBoundingClientRect 。 两种方法都为您提供了一个具有x, y, width, height属性的对象，您可以使用它来计算您的中心。

由于您使用svg.js标记了您的问题，我还将为您提供svg.js的解决方案。

// Vanilla
node = document.getElementById('myEl').getBBox()

// with svg.js
SVG.adopt(document.getElementById('myEl')).bbox()

第二个解决方案为您提供了一个已经为您计算过cx和cy的对象。

可以在文档中找到此方法