Setting D3 Force Graph parameters using json
I am trying to create a more reusable version of the power web in d3.js. My thought was to be able to use the json file containing the data to specify the network properties.
{
"nodes":[
{"name":"Myriel","group":1},
{"name":"Napoleon","group":1},
{"name":"Mlle.Baptistine","group":1},
//etc.....
{"name":"Child2","group":10},
{"name":"Brujon","group":4},
{"name":"Mme.Hucheloup","group":8}
],
"links":[
{"source":1,"target":0,"value":1},
{"source":2,"target":0,"value":8},
{"source":3,"target":0,"value":10},
//etc....
{"source":76,"target":62,"value":1},
{"source":76,"target":48,"value":1},
{"source":76,"target":58,"value":1}
],
"graph":{"charge":-220,"linkDistance":50}
}
To do this, I have translated the call to d3.layout.force () into a json call, see this jsfiddle .
Then I define the graph behavior as
var force = d3.layout.force()
.charge(graph.graph.charge)
.linkDistance(graph.graph.linkDistance)
.size([width, height]);
My question is, is this the correct way to do it. The only drawback I see at the moment is that it takes a little longer to initialize the graph. Is there a better way?
+3
source to share
No one has answered this question yet
Check out similar questions: