javascript - 尝试理解 Hive Plot 的 D3 代码

Question

这是 Hive Plot 的 D3 代码的链接 .. http://bl.ocks.org/mbostock/2066415

我对此有两个问题:

1. 数组“nodes”中的对象中的索引“y”表示什么

   var 节点 = [ {x:0，y:.1}， {x:0，y:.9}， {x:1，y:.2}， {x:1，y:.3}， {x:2，y:.1}， {x:2，y:.8}];

2. 如何将数据(json 文件)绑定(bind)到元素以获得更复杂的 Hive Plot？我也能做到吗？我的数据是一个蛋白质-蛋白质相互作用数据集，包含源蛋白质节点、目标蛋白质节点、蛋白质类型、蛋白质名称和蛋白质组。我想使用 hive 图进行网络可视化。

请帮忙。我是编程新手。

Answer 1

1. y 属性是在图表中映射为半径的域值。通过使用半径函数(声明为 d3 线性比例)，0..1 之间的值将映射到 40 到 240 之间的值(innerRadius、outerRadius)。为了更好地理解，将其与 x 值进行比较:它被传递给 Angular 函数，同样是 d3 尺度，但这一次，它是序数类型:它将离散值 0, 1, 2 转换为之间的 Angular 0 和 2*PI。

2. 你可以通过data(..)方法绑定(bind)任意数据(包括json)。数据(随处可见的“d”属性)是您提供给 select 函数的任何 json 对象。 select(..) 和 data(..) 的组合称为联接:它将 svg 元素与数据中的每个项目相匹配。此时，您可以以最适合您需求的方式自由解释和访问您的自定义数据。