问题标签 [circle-pack]

如何从下面的代码中获取两个单独的点击事件

1.点击圆圈时会显示“Circle Click”。

2.然后在显示“背景点击”警报后立即显示。

我需要的是让这两个事件相互独立，所以当我点击一个圆圈时，“Circle Click”会发出警报，而“Background clicked”只会在我点击背景（即图表容器）时发出警报。

我从一个定期更新半径的数据集中按照包布局排列了圆圈。

我开始使用的代码是气泡图的标准示例：http: //bl.ocks.org/mbostock/4063269

每当圆圈大小发生变化时，它们就会过渡。通常当圈子变大时，它们会移动到与其他圈子重叠的地方。我不希望它们相互重叠。

我对 d3 还是很陌生，已经移动了很多代码并尝试了我能想到的一切，但没有运气。

该函数makeBubbles传递原始 Json（见下文）。

传递的数据看起来像这样（随着数据集的更新而变化）：

我想为强制导向布局上的每个节点创建一个圆形包装。我正在寻找一个例子，但我找不到任何例子。我是 D3 和 infovis 的新手。我尝试了一些布局，但我不知道如何实现这一点。

我有一个包含多个级别（深度）的包布局，其中一些第一个不可见（就像在示例中一样： http: //bl.ocks.org/mbostock/4063269：

...隐藏根节点的位置）。

但是，缩放是通过将所有圆圈拟合到 svg 容器中来实现的，而不仅仅是可见的。如果使一些顶部圆圈不可见，这会导致空间损失......

什么是重新调整布局以仅适合容器中可见圆圈的好方法？我考虑过检查所有节点的极端 x/y 坐标并基于此重新缩放...

我有一组使用 d3.js 可视化的数据。我以气泡的形式表示数据点，其中气泡的配置如下：

其中 xp、yp、colorp 和 radiusp 定义如下：

此时，气泡在其位置上显示为静态（其中位置由 xp 和 yp 定义），而气泡的大小基本上来自 radiusp，颜色由 colorp 定义。

现在我将它们完全按照这个例子展示：http: //bl.ocks.org/mbostock/4063269

我需要以这种形式显示它们：http: //jsfiddle.net/andycooper/PcjUR/1/

即：它们应该使用重力功能包装，具有一定的电荷，可以在一定程度上相互拖动和排斥。我可以看到有一种通过 d3.layout.force() 的方法，但无法真正将其集成到其中。如果您能建议我正确的路径或一些工作示例甚至提示，我将非常感激。谢谢你。

我肯定对 d3 越来越熟悉了，开始探索过渡和什么不是，并开始真正了解数据是如何组合在一起的。

我正在研究一个具体的例子，一个气泡图，http ://bl.ocks.org/mbostock/4063269 ：

我试图重新利用它来代表人口随时间的增长。这是我的 JSON

没有做很多很酷的事情，我已经能够从每年显示一组特定的数据开始，调整过滤器让我加载它只显示特定的年份，但看起来这是不正确的方式，因为如果我手动将过滤器更改为下一年，那么它只显示 1800 的气泡，但中心有空白区域，好像它仍在尝试加载 1790 气泡。

我也很难找到一种方法来使用 JS 命令更改该过滤器，以便人们可以在年份之间切换。我怎样才能更好地理解这一点？

我正在使用 D3 包布局，我的数据非常大。

所以问题是数据太大而无法平滑渲染。我想按深度修剪数据，但我完全不知道如何做到这一点。

我唯一能想到的就是编写一个递归函数来在每次新鲜时修剪整个数据。

但我认为这里一定有办法处理它：

我的代码在bl.ocks.org上：

更改选择标签的值以限制圆圈的数量。如果您不经常使用它，它似乎可以工作，但特定情况（例如，为 TE 选择 10，然后选择 247）每次都会崩溃。如果您检查控制台，您会看到有问题的行是nodes = pack.nodes(data);. 我看到两种可能性：要么这是 d3 的包布局的错误，要么我的数据被弄乱了。你能说出这两种情况是否存在吗？如果是，具体问题是什么？

我有一个基于绑定到分层数据集的可缩放圆形包布局示例的可视化。

我看到给定深度的圆的面积不能直接比较的问题，即比率为 2 的值在视觉上似乎没有相同比率的面积。

我预计打包算法会出现一些错误，但正如以下日志片段所示，它非常重要：

我很高兴进一步挖掘并尝试调试，但在此之前想检查我对算法的理解是否正确，即每单位值的面积比在理想情况下应该在所有级别上保持不变，如果不是至少对于给定的深度?

我一直在玩弄圆包样品。但是，尝试从一组新的 JSON 数据更新事物并在之后刷新它时遇到了很多麻烦。

我的代码只是圆形包示例的修改版本：

这按预期工作。但是，我想做刷新功能，从新的 JSON 数据更新图表并刷新。我已经尝试了下面的代码，但它只是添加了新元素而不是更改旧元素 - 并且也不会删除旧元素（node.exit.remove() 显然永远不会运行）。我想知道它是否与使用“数据”而不是“数据”有关，以及在这方面是否实际上进行了数据连接：

我很难弄清楚数据实际上是如何绑定到包的以及如何更新它。我可能再次错过了一些简单的东西，但任何帮助将不胜感激，因为我很难找到说明这一点的样本。如果有人可以在这里帮助我，我将来会很乐意为其他人制作一个。:)

作为记录，我使用的数据是这样的：

和