D3可视化问题

D3 Visualization Questions

本文关键字：问题 可视化 D3      更新时间：2023-09-26

我正在做一个可视化的工作，我在stackoverflow上找到了一个jsfiddle。

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

我想可视化一些json，像这样

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

我一直在这里做一个jsfiddle

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

  1. 我如何确保文本和圆圈不相交?前面的小提琴确保了圆圈的这一点，但我想防止一个圆圈的标签与其他圆圈/其他标签相交。
  2. 如何更改圆圈的大小以相对于窗口中开放空间的数量进行缩放?我想我要做一个800 * 800的窗口，如果有很多空白空间和一些圆圈，我想让圆圈变大，如果没有，我想让它们变小。

任何提示将不胜感激，谢谢!(我知道我可以自己解决这些问题，而且我做得很慢，但是一些关于如何做这些事情的例子会对我有所帮助!

对于你的第一个问题的简短回答是，你不能在D3中自动做到这一点。你可以通过手动检查标签和圆圈的位置，或者使用像D3的强制布局来自动布局它们而不重叠来确保这种情况。这两种选择都需要大量的工作，而在第二种情况下，你不能保证没有重叠。

关于你的第二个问题，你决定窗口的大小并设置相应的半径，例如像

var radius = Math.sqrt(window.innerWidth * window.innerHeight) / 100;
相关文章：