问题标签 [force-layout]

我用 d3 创建了一个由相关对象组成的交互式力导向树。节点和链接是使用 d3 树布局创建的。

数据结构如下：

节点/链接按以下方式创建：

为了启用树的双向遍历，我从每个新创建的节点递归地沿着树向下走，并为所有节点添加父引用。

可以通过单击叶节点来扩展树。然后通过 AJAX 加载数据并更新树。

这样做的问题是具有相同 ID/名称的对象可能会在树中多次出现。有没有办法从 JavaScript 代码中干净地合并所有重复节点（由于交叉链接，这会将树转换为图形）？

编辑：也许这样做的唯一方法是走下整个树并重新链接指向副本的所有链接......虽然我认为这可能会大大减慢脚本......

由于我是初学者，这是关于 D3.js 的另一个问题。

我已经构建了一个力有向图，就像很多人一样。

所有节点都存储在一个数组中，所有链接都存储在另一个数组中。

现在我希望将中心节点固定在 svg 的中间，而其他节点则在它周围徘徊。

是否有可能只从力布局中删除一个节点而不会从我的网络中掉出来？有人已经做到了吗？

我完全按照此处所示使用 d3.js，但具有不同的数据值。

当图表第一次显示时，所有元素都是分散的，并在大约一秒钟内迅速向它们的位置移动。这在示例中看起来不错，但对于我的数据，它看起来并不那么好。有什么方法可以关闭它，以便节点在指定的位置开始？有什么方法可以自定义此条目可视化？

我从 d3.js 开始，我想知道当鼠标悬停在力导向图的节点上时显示包含文本（工具提示）的框的最简单方法。此外，此框中包含的文本必须为每个节点自定义（类似于function(d){return d.fullName;})）

这是我现在拥有的示例代码。

提前致谢

当我在我的 d3 力有向图上使用醉酒时，我遇到了一个问题：当我将醉酒重力设置为西时，醉酒从我圈子的左上角开始。我怎样才能让它从我圈子的右侧开始？

这是我在 d3 中使用的代码示例：

编辑在这个问题中：https ://stackoverflow.com/a/10806220/1041692他们说如下：

您可以尝试将工具提示添加到与实际圆圈重叠的 svg:g 中，但宽度和高度为零。目前它正在使用边界框并将工具提示放在边缘。玩弄醉醺醺的选项也可能会有所帮助。

但是要么我做错了，要么它不起作用，它并没有解决我的问题。

编辑 2这个问题也取决于浏览器，在 chrome 中，tipsy 元素附加在圆圈的左上角，而我希望它附加在圆圈右侧的中间。在 Firefox 中，醉酒出现在整个网页的左上方。

我有一个 d3.js 静态力布局图，它可以变得相当大（有时部分被剪裁），所以我想让用户通过拖动来平移整个图。我认为我不需要拖动单个节点，我有一种感觉会令人困惑，但希望能够显示被 svg 边界裁剪的图形部分。

我在http://bl.ocks.org/3811811有一个最小的例子，它使用

来实现平移，但我发现它真的很“飘忽”，而且根本不是很平滑，以至于我猜它会阻止人们尝试拖动功能。有没有人知道为什么会发生这种情况和/或如何解决它的想法？

我想使用 D3.js 生成一个层次力图 - 一个力导向图，它允许您通过单击将图形扩展到子级（显示子级之间的关系）的节点来导航树状结构。节点可以通过两种方式相互关联，父节点或兄弟节点。父关系表明节点“属于”它们的父节点。

作为一个起点，我查看了力集群示例：https ://github.com/mbostock/d3/blob/master/examples/force/force-cluster.html ，并包括了上面的关系，但我不知道了解如何只渲染扩展的集群而不是整个网络（见下图）。

上图：力图，其中红色链接表示兄弟关系。

也可以将“孩子”安排为 JSON 中的孩子，而不是使用父“类型”：

但是，如何在跟踪子节点之间的关系的同时结合树结构？

一个富有想象力的树状结构如下所示：

下半部分表示所需的视觉布局（类似于上图中的功能）。

您对如何进行有什么建议吗？

使用 d3 中的强制布局，我可以愉快地添加节点，例如，一个圆形的 SVG 组和一些文本：

但是，我想根据节点数据选择向组添加另一个元素：因此，如果此节点的数据包含“图像”属性，我想添加一个新的子元素（一个 svg:image ）。将 svg:image 添加到所有节点很容易（我只是按照上面的圆圈和文本进行操作）。动态更改您已经创建的元素的属性也很容易（通过将函数作为属性的值，text如上所述）。只有当数据包含属性时，我才知道如何添加svg:image子元素。实现这一目标的最佳方法是什么？image

我正在使用 d3 强制定向布局来绘制连接节点图。每次节点数量发生变化时，我都想以较小的尺寸显示整个图形。为此，我使用了 SVG 的 scale 属性。但是，我无法固定图表的位置。

下面是我正在使用的代码：

svg --> 是保存我的图表的主要 SVG 元素
bh --> 我的 svg 元素直径的宽度和高度
--> 是力图

我正在使用以下 Javascript + SVG + D3 代码。
http://bl.ocks.org/1095795

代码在这里：
https ://gist.github.com/1095727

简而言之，我需要每个节点的唯一图像（而不是现在拉的重复的笑脸图像），但我不够精明，无法实现它。任何帮助，将不胜感激。