Javascript 是否可以在强制布局的节点对象中保存额外数据

我正在使用d3库构建一个强制布局图，并使用它来可视化图形数据

我希望在节点上显示一个人类可读的标签，然后单击时，查询该节点的图形连接属性（节点本身有一个

资源uri

，我希望该uri存储在每个节点的数据中）

---

是否可以在节点对象中存储该额外的键/val？如果没有，您将如何着手解决该问题？

完全可能，而且通常是可取的

使用一系列节点（对象数组）初始化力布局。一些参数预计会出现在这些节点中（如

weight

或

fixed

），其他参数通过强制布局应用于这些节点（如

x

，

y

，

px

，

py

）。挂在这些对象上的任何其他参数都不会破坏任何东西，更重要的是，强制布局不会将它们删除；它们将被持久化，并在渲染布局时对您可用，这既方便又有用

事实上，传递给force布局的对象数组可以是用于获取和存储数据的任何对象（例如主干模型）的实例数组。如果这样做，就有可能发生名称冲突。例如，如果您的模型有一个名为

x（）

的方法，并且您将该模型传递到force布局中，则布局将使用计算的

x

位置覆盖它。因此，更明智的做法可能是通过节点的属性链接到关联的模型，但这并不是必然需要的

更新

有关节点如何具有与force布局的工作方式无关的额外键/值对的示例，请参见。具体来说，请参见如何使用加载的json中的

d.group

，在渲染时确定节点颜色，但对节点的行为没有任何影响。这就相当于你要求展示一个人类可读的标签

现在，如果您想与某个类的实例集成，例如

Backbone.Model

s，您可以这样做（参考上面链接的Les Misérables示例）：

因为现在这些都是主干模型，所以必须使用

get（）

作为属性。因此，在呈现布局时，它不是

d.group

，而是

// d is a Backbone model now
.style("fill", function(d) { return color(d.get('group')); })

正如我之前警告的那样，你必须记住，部队布局对这些是主干模型或诸如此类的实例一无所知。因此，在计算节点位置时，它不会在内部调用类似于

node.set（'x'，…）

的东西。与之前一样，它将运行

node.x=…

，因此现在您将拥有主干模型，这些主干模型还具有由force布局应用于它的

x

，

y

属性。如果出于某种原因，您的模型扩展了主干模型，并向其添加了一个名为

x:function（）{…}

，该方法将被布局覆盖（使用

x

位置值）。因此，您必须注意这一点，如果您需要解决这一问题，那么就不要对节点使用主干模型。相反，使用泛型对象，就像mbostock的示例那样，并将模型的关联实例存储在节点上。像

d3.json("miserables.json", function(error, graph) {
  graph.nodes.forEach(function(nodeJson) {
    bbModel = new Backbone.Model(nodeJson);
    nodeJson.model = bbModel
  });

  force
    .nodes(graph.nodes)
    .links(graph.links)
    .start();
});

现在呈现如下所示：

.style("fill", function(d) { return color(d.bbModel.get('group')); }) 

---

谢谢你。是否有任何代码可以向我展示或引用，以显示使用实例数组的force布局？我不知道有哪些示例使用非泛型对象的实例，因为典型的d3示例不包含其他框架。好吧，“那么你能写一小段代码来证明你所说的是可以做到的吗？”克里斯蒂安回答说，并做了进一步的解释

.style("fill", function(d) { return color(d.bbModel.get('group')); })