You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
31 lines
818 B
31 lines
818 B
var WIDTH = 300;
|
|
var HEIGHT = 200;
|
|
|
|
d3.select("svg")
|
|
.attr("width", WIDTH)
|
|
.attr("height", HEIGHT);
|
|
|
|
var nodesData = [
|
|
{"name": "Travis", "sex": "M"},
|
|
{"name": "Rake", "sex": "M"},
|
|
{"name": "Diana", "sex": "F"},
|
|
{"name": "Rachel", "sex": "F"},
|
|
{"name": "Shawn", "sex": "M"},
|
|
{"name": "Emerald", "sex": "F"}
|
|
];
|
|
|
|
var nodes = d3.select("g")
|
|
.selectAll("circle")
|
|
.data(nodesData)
|
|
.enter()
|
|
.append("circle");
|
|
|
|
d3.forceSimulation()
|
|
.nodes(nodesData)
|
|
.force("charge_force", d3.forceManyBody())
|
|
.force("center_force", d3.forceCenter(WIDTH / 2, HEIGHT / 2)) //position centering force at center x,y coords
|
|
.on("tick", function(){
|
|
nodes.attr("cx", function(d) { return d.x; })
|
|
.attr("cy", function(d) { return d.y; });
|
|
});
|