Sometimes, we want to get coordinates of an svg element with JavaScript.
In this article, we’ll look at how to get coordinates of an svg element with JavaScript.
How to get coordinates of an svg element with JavaScript?
To get coordinates of an svg element with JavaScript, we call the getBoundingClientRect method.
For instance, we write
const { x, y } = element.getBoundingClientRect();
to get the x and y coordinates of the svg element with the getBoundingClientRect method.
Conclusion
To get coordinates of an svg element with JavaScript, we call the getBoundingClientRect method.
2 replies on “How to get coordinates of an svg element with JavaScript?”
Hi John,
Have you found a cross-browser alternative to getBoundingClientRect?
getBoundingClientRect has a bug in safari iOS where the values returned are way off from what they actually are.
See https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect#browser_compatibility
You have issue with getting the right top value?