[英]json representation for d3 force directed networks
I am trying to make a network visualisation of RISK. 我正在尝试对RISK进行网络可视化。 You can view it with the required code at http://bl.ocks.org/4683850 .
您可以在http://bl.ocks.org/4683850上使用所需的代码进行查看。
The visualisation works but it required a lot of manual labor. 可视化可以工作,但是需要大量的人工。 I manually adapted the json file such that the connections were of the following shape:
我手动调整了json文件,以使连接具有以下形状:
{
"source": 1,
"target": 0,
"value": 5
}
What would one need to do to the d3 code such that a connection is determined by the names of the nodes? 一个人需要对d3代码做些什么,以使连接由节点的名称确定? The input would then be:
输入将是:
{
"source": "WesternAustralia",
"target": "NewGuinea",
"value": 5
}
Whenever I try that I get the following error: 每当我尝试时,都会出现以下错误:
Uncaught TypeError: Cannot call method 'push' of undefined
The D3 docs provide an explanation of how links work: D3文档提供了有关链接如何工作的说明:
https://github.com/mbostock/d3/wiki/Force-Layout#wiki-links https://github.com/mbostock/d3/wiki/Force-Layout#wiki-links
In short, the array of links can either contain indices for source
and target
, which get remapped to objects from nodes
, or they contain the references to the objects from nodes
themselves. 简而言之,链接数组可以包含
source
和target
索引,它们从nodes
重新映射到对象,或者包含从nodes
本身到对象的引用。 You need to remap your links' source
and target
to the objects from nodes
. 您需要将链接的
source
和target
重新映射到nodes
的对象。
Assuming your source
and target
properties are using names as shown in your second example above, you can add the follow snippet to the beginning of your d3.json
callback to do the remapping: 假设您的
source
属性和target
属性使用的名称如上面第二个示例所示,则可以将以下代码段添加到d3.json
回调的开头以进行重新映射:
var nodeMap = {};
graph.nodes.forEach(function(x) { nodeMap[x.name] = x; });
graph.links = graph.links.map(function(x) {
return {
source: nodeMap[x.source],
target: nodeMap[x.target],
value: x.value
};
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.