D3可视化问题

Question

我正在开发一个可视化工作，并在stackoverflow上找到一个jsfiddle。

我之前没有做过D3，所以我有几个问题。

我想像这样想象一些json

{word:"cat", count: 30},
{word:"dog", count: 15}....

我一直在努力研究jsfiddle

http://jsfiddle.net/matthewpiatetsky/nCNyE/3/

1. 如何确保文字和圆圈不相交？之前的小提琴为圆圈确保了这一点，但我希望防止一个圆圈的标签与其他圆圈/其他标签相交。
2. 如何更改圆的大小以相对窗口中的开放空间量进行缩放？我想我会做一个800乘800的窗口，如果有很多空的空间和很少的圆圈，我想让圆圈变大，如果没有，我希望它们变小。

任何提示都将不胜感激，谢谢！ （我知道我可以自己解决这个问题，而且我的工作进展缓慢，但是如何做一些我可以玩的东西的例子会有所帮助！

Answer 1

您的第一个问题的简短答案是您无法使用D3自动执行此操作。您可以尝试通过手动检查标签和圆圈的位置，或者使用D3的力布局等自动布局而不重叠来确保这种情况。这些选项中的任何一个都会有相当多的工作，但在第二种情况下，你无法保证不会有任何重叠。

关于第二个问题，您可以确定窗口的大小并相应地设置半径，例如：

之类的东西

var radius = Math.sqrt(window.innerWidth * window.innerHeight) / 100;