圈内的d3.layout.pack文本会覆盖其他圈子中的其他文本

时间:2014-07-02 23:28:23

标签: javascript css svg d3.js circle-pack

我使用d3.layout.pack将圈子放在其他主圈内,例如http://mbostock.github.io/d3/talk/20111018/pack.html

enter image description here

但我在圆圈内有较大的文字覆盖圆圈,可以覆盖近圆圈中的另一个文字:

enter image description here

我能想到的解决方案是:

  • 剪切文字以不覆盖圆圈
  • 为圈子添加较小的字体。
  • 设置更大的填充
  • 将工具提示放在圈子上
  • 旋转文字??

但这些想法并不能让我满意。在这种情况下,我希望将两个较小的球放在一起。

d3.layout.pack可以做一些更有趣的事情,避免圆圈重写吗?

我可以使用d3.layout.force吗?有什么想法吗?

1 个答案:

答案 0 :(得分:1)

我建议作为question 'Text along a circle in a D3 circle pack layout'的答案的可能性之一:

jsfiddle

enter image description here

基本上,idea是沿圆圈绘制标签,而不是在圆圈的中心。此外,您可能会考虑当时仅绘制一些标签 - 可能应省略属于小圆圈的标签。