如何找到 SVG 文本位置

Question

这是我的代码，

<html>
<body>
<svg id="text" height="400" width="400" >
<text transform="rotate(127,128,64)" opacity="1" text-anchor="start" font-weight="regular" font-style="Normal" font-family="Segoe UI" font-size="12px" fill="#191919" y="68.25" x="128" id="caption">Revenue </text>
 </div>
</body>
</html>

文本（收入）的起始 x 位置是 128。如何找到文本（收入）的最后一个字符（e）的 x 位置。需要真正的计算。因为度数的旋转是多变的。

Answer 1

调用 getStartPositionOfChar 并通过转换它们来转换局部坐标，例如

var pos = document.getElementById("text").getStartPositionOfChar(6);
var matrix = document.getElementById("text").transform.animVal.getItem(0).matrix;
var position = pos.matrixTransform(matrix);
alert(position.x + ", " + position.y);

<html>
<body>
<svg height="400" width="400" >
<text id="text" transform="rotate(127,128,64)" opacity="1" text-anchor="start" font-weight="regular" font-style="Normal" font-family="Segoe UI" font-size="12px" fill="#191919" y="68.25" x="128" id="caption">Revenue </text>
 </div>
</body>
</html>

如何找到 SVG 文本位置

how to find the SVG text location

javascript

html

svg