我希望能够在 D3 中设置文本元素的宽度。现在我有一些圆形文本，但我无法设置该元素的宽度。 (假设 nodeEnter 是我图中的一个节点)
nodeEnter.append("circle")
.attr("r", function(d){return d.radius+"px";});
/* Add text in middle of circle */
nodeEnter.append('text')
.text("this is a very long text");
我想要的是找到一种简单的方法来设置该文本元素的宽度(溢出向下，就像在简单的 div 中一样)。我现在的方法如下:
nodeEnter.append("circle")
.attr("r", function(d){return d.radius+"px";});
/* Add text in middle of circle */
nodeEnter.append("foreignObject")
.attr("width", 130)
.attr("height", 200)
.attr("class", "myCSS")
.append("xhtml:div")
.html("this is a very long text");
但是我认为这不是最好的解决方案，例如我在 myCSS 中设置的所有内容都被覆盖。此外，我不知道如何将异物置于圆的中心(尤其是在 x 轴上)。
预先感谢您的帮助。
最佳答案
如果您想要自动换行，带有 div 的 foreignObject 是最佳选择。您提到的问题可以相对容易地解决。当您为 svg 元素设置 myCSS 时，您没有为 div 设置它。如果您在附加 div 之后添加行来设置 CSS 类，它应该会获取设置。
使文本居中的最简单方法可能是设置 div 的大小以接触圆的边缘，并添加 CSS 使文本在 div 内居中>.
关于javascript - 设置文本宽度或将文本放入 div 中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/13803678/