Question

有一些类似的问题与查找文本元素的宽度有关。一个人对D3版本3有一个答案。这个问题对D3版本4更具体。

似乎有办法找到文本元素的宽度 - 使用getBBox（）。

但是当我看到文本元素的原型时，我发现没有getBBox（）。事实上，我找不到任何有用的东西来找到宽度。

我正在使用d3 with react-faux-dom。

Answer 1

创建了一个简短的片段，展示了我在评论中所做的事情。在SVG中创建一个文本元素，然后选择元素节点并调用getBoundingClientRect()。我只输出.width，但https://www.freeformatter.com/regex-tester.html。

d3.select("#test").append("text").attr("id", "innerText").attr("x", "10px").attr("y", "20px").text("This is text");

var textRect = d3.select("#innerText").node().getBoundingClientRect();
console.log(textRect.width);

text{stroke:black;}

<html>
<script src="https://d3js.org/d3.v4.min.js"></script>
<body>
  <svg id="test"></svg>
</body>
</html>

使用D3版本4获取SVG中文本元素的宽度

1 个答案: