突出显示一组节点及其之间的关系
Highlight a set of nodes and their relation between them
我正在使用 D3 处理力定向图,并在图形区域旁边的单独表中显示图形中显示的所有节点。我在显示的表中有复选框,它为我提供了选择节点的选项。
我试图突出节点和它们之间的关系。我一直在从此示例中获取指针 突出显示所选节点、其链接及其子节点 在 D3 力定向图中。此示例适用于一个特定节点及其子节点,但如果它们之间存在任何关系,我将尝试突出显示多个节点。
这方面的任何帮助都将非常有用。
我没有使用力定向图,而是使用"径向轮辐图"(又名"径向轮"),但前提应该是相同的。 在我的示例中,关系由饼图弧表示,关系中的节点位于弧的两端。 在示例中,您将看到我如何根据类型(将鼠标悬停在任何弧或节点名称上)或同时选择特定节点和/或关系(将鼠标悬停在任何弧或节点名称上)或多个节点和关系(将鼠标悬停在颜色编码类型键上)。
在任一选择示例中,都归结为为图形中的每个元素分配唯一标识符。 您可以通过搜索 .attr("class"...) 和 .attr("id"...) 语句来了解我是如何做到这一点的。 分配此类唯一标识符后,可以使用它们创建选择组合。 您可以看到我如何在 .on("鼠标悬停", ...) 函数中执行此类选择。
顺便说一句,你能把你的例子发布到 bl.ocks.org 吗? 如果我们可以看到您的代码,那么帮助您会更容易。
我希望这有所帮助。
我最好的,
弗兰克
相关文章:
- 绘制的节点和Google图表/可视化中的数据节点之间的关系
- D3Javascript中的力定向图中节点之间的链接
- 如何通过在两个节点之间拖放来制作边缘,并在细胞空间中扩展 egdehandle 扩展.js
- 在强制布局 D3.js 中保持节点之间的动态链接距离
- D3 力布局:如何保持节点之间的给定最小距离
- D3:对两个节点之间的圆进行动画处理
- d3:计算两个节点之间的线的中点,画一条从它到一个新节点成90度角的线
- PHP在HTML节点之间获取文本
- 如何在Cytoscape JS中添加两个节点之间的多个偏移边
- 查找两个标记/节点之间的文本
- 如何在CYTOSCAPE JS中突出显示两个节点之间的路径
- 如何找到两个抽象节点之间的路径?
- tree. nodesize()不能在D3树图中包含节点之间的空间
- jquery DOM两个节点之间的距离
- 使用cytoscape.js如何同时显示节点之间的箭头和自定义标签
- 节点之间的区别是什么?nextSibling和ChildNode.nextElementSibling
- 指定infoVis JIT图中节点之间的最小距离
- 在多个节点之间查找成本最小的路径
- 理解对象的问题(获取母子节点之间的年龄差)
- 在cytoscape.js中显示节点之间的关系