我正在尝试让我的标签正确包装。我需要使刻度线和标签相匹配。我正在对标签使用换行功能，但无法使其与 tspan 一起使用。
工作演示 https://codesandbox.io/s/react-d3-pie-chart-forked-nhh85?file=/src/index.js
UPDATE
这是之前和之后的图片，以帮助理解我想要什么。
遗憾的是没有简单的方法来获取 SVG<text>元素的内容像 HTML 中那样换行。然而我确实发现这个类似问题的答案 https://stackoverflow.com/questions/24784302/wrapping-text-in-d3这建议使用D3 Plus https://github.com/d3plus/d3plus向 D3 添加文本换行的库。
如果由于某种原因这不是一个选项，您可能必须自己计算包装，这是一个有点令人讨厌的过程，但通过一些努力是可以实现的。一般来说，您需要：
- 创建与目标 SVG 文本具有相同宽度和字体样式的 HTML 元素
- 将所需的内容逐字添加到该元素中
- 添加每个单词后检查 HTML 元素的高度，如果它增加了，您就知道在该单词之前需要换行
- 一旦您知道需要使用多少行
<tSpan>输出每行文本的元素（您必须手动设置每个新行的顶部偏移量）
如果可能的话，我绝对建议使用该库！
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
