[英]Find center of svg shape
Im using svgjs
to create my shapes. 我使用svgjs
来创建我的形状。 How can I find the center point of an svg shape and add an element there? 如何找到svg形状的中心点并在那里添加元素? In my case a red dot. 在我的情况下,一个红点。 I can't find any information in the documentation for a method or something that helps in this situation. 我在文档的文档中找不到任何有助于这种情况的信息。
You can use the method getBBox
or alternatively getBoundingClientRect
. 您可以使用方法getBBox
或getBoundingClientRect
。 Both methods give you an object with the properties x, y, width, height
, which you can use to calculate your center. 两种方法都为您提供了一个具有x, y, width, height
属性的对象,您可以使用它来计算您的中心。
Since you tagged your question with svg.js
I will also give you a solution with svg.js
. 由于您使用svg.js
标记了您的问题,我还将为您提供svg.js
的解决方案。
// Vanilla
node = document.getElementById('myEl').getBBox()
// with svg.js
SVG.adopt(document.getElementById('myEl')).bbox()
The second solution gives you back an object which has cx
and cy
already calculated for you. 第二个解决方案为您提供了一个已经为您计算过cx
和cy
的对象。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.