如何用 JS 获取 SVG 内 path 元素中的图形的实际位置及尺寸

JavaScript010

如何用 JS 获取 SVG 内 path 元素中的图形的实际位置及尺寸,第1张

用 JS 获取 SVG 内 path 元素中的图形的实际位置及尺寸的方法:

1、使用getElementById获取svg节点对象:

var el = document.getElementById("yourElement")

2、调用getBoundingClientRect获取path的边界矩形的位置:

var rect = el.getBoundingClientRect()

3、分别获取width和height属性就得到实际位置了。

console.log( rect.width )

console.log( rect.height)

没有学过该库。不过可以猜想一下,基于js的话,js中绘图是基于canvas元素的。而canvas中的话,path方法估计就是基于这个:

beginPath()

lineTo(坐标)

closePath().

具体的话,可以参看w3c的教程中有关canvas部分。