HTML5 - 如何获取 SVG 文本元素的中心点？

Question

我对 SVG 文本元素有疑问。我想找到 SVG 文本的中心点。在 HTML 文件中:

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
    <text x="300" y="300" style="font-size: 80px;" id="test">It is example text</text>
 </svg>

在 Javascript 中我有类似的东西:

var obj = document.getElementById('test').childNodes[1];
var box = obj.getBBox();

var centerPoint = new Object();
centerPoint.x = box.x + box.width / 2;
centerPoint.y = box.y + box.height/ 2;

但它不起作用 - 中心点低于我的预期。可能我错过了什么，我确定我必须从“centerPoint.y”中减去一个文本属性。 “centerPoint.x”值似乎没问题。已在 IE9 浏览器、Chrome、Opera 和 Firefox 上检查。结果是一样的。

或者您有其他解决方案？

编辑

总结一下我的代码工作正常。我重写了整个代码，现在可以了。我不知道发生了什么，可能我的浏览器根本没有刷新脚本。无需将行高设置为“0”。 getBBox 这就是我需要做的一切。

无论如何，感谢您的宝贵时间，对不起我的英语! :)

Answer 1

行高可能是一个原因。文本的位置通常比它的中心高一点/