Force-Directed Graph for Eurovision

data.json

{
"nodes":[
{"name":"Albania","group":0},
{"name":"Armenia","group":0},
{"name":"Austria","group":0},
{"name":"Azerbaijan","group":0},
{"name":"Belarus","group":0},
{"name":"Belgium","group":0},
{"name":"Bulgaria","group":0},
{"name":"Croatia","group":0},
{"name":"Cyprus","group":0},
{"name":"Denmark","group":0},
{"name":"Estonia","group":0},
{"name":"F.Y.R. Macedonia","group":0},
{"name":"Finland","group":0},
{"name":"France","group":0},
{"name":"Georgia","group":0},
{"name":"Germany","group":0},
{"name":"Greece","group":0},
{"name":"Hungary","group":0},
{"name":"Iceland","group":0},
{"name":"Ireland","group":5},
{"name":"Israel","group":0},
{"name":"Italy","group":0},
{"name":"Latvia","group":0},
{"name":"Lithuania","group":0},
{"name":"Malta","group":0},
{"name":"Moldova","group":0},
{"name":"Montenegro","group":0},
{"name":"Norway","group":0},
{"name":"Romania","group":0},
{"name":"Russia","group":0},
{"name":"San Marino","group":0},
{"name":"Serbia","group":0},
{"name":"Slovenia","group":0},
{"name":"Spain","group":0},
{"name":"Sweden","group":0},
{"name":"Switzerland","group":0},
{"name":"The Netherlands","group":0},
{"name":"Ukraine","group":0},
{"name":"United Kingdom","group":5}
],
"links":[
{"source":0,"target":33,"value":6},
{"source":0,"target":15,"value":3},
{"source":0,"target":36,"value":4},
{"source":0,"target":28,"value":5},
{"source":0,"target":17,"value":8},
{"source":0,"target":9,"value":1},
{"source":0,"target":3,"value":7},
{"source":0,"target":16,"value":10},
{"source":0,"target":21,"value":12},
{"source":0,"target":27,"value":2},
{"source":1,"target":13,"value":2},
{"source":1,"target":4,"value":5},
{"source":1,"target":24,"value":6},
{"source":1,"target":29,"value":7},
{"source":1,"target":9,"value":4},
{"source":1,"target":16,"value":8},
{"source":1,"target":37,"value":12},
{"source":1,"target":21,"value":1},
{"source":1,"target":27,"value":3},
{"source":1,"target":14,"value":10},
{"source":2,"target":25,"value":2},
{"source":2,"target":5,"value":3},
{"source":2,"target":15,"value":6},
{"source":2,"target":36,"value":8},
{"source":2,"target":28,"value":4},
{"source":2,"target":9,"value":5},
{"source":2,"target":3,"value":12},
{"source":2,"target":16,"value":7},
{"source":2,"target":37,"value":1},
{"source":2,"target":21,"value":10},
{"source":3,"target":23,"value":3},
{"source":3,"target":25,"value":1},
{"source":3,"target":4,"value":7},
{"source":3,"target":24,"value":8},
{"source":3,"target":28,"value":6},
{"source":3,"target":9,"value":5},
{"source":3,"target":16,"value":4},
{"source":3,"target":37,"value":12},
{"source":3,"target":27,"value":2},
{"source":3,"target":14,"value":10},
{"source":4,"target":23,"value":5},
{"source":4,"target":25,"value":4},
{"source":4,"target":24,"value":7},
{"source":4,"target":29,"value":8},
{"source":4,"target":1,"value":2},
{"source":4,"target":9,"value":1},
{"source":4,"target":3,"value":10},
{"source":4,"target":16,"value":6},
{"source":4,"target":37,"value":12},
{"source":4,"target":27,"value":3},
{"source":5,"target":25,"value":3},
{"source":5,"target":29,"value":4},
{"source":5,"target":36,"value":12},
{"source":5,"target":34,"value":1},
{"source":5,"target":9,"value":10},
{"source":5,"target":3,"value":5},
{"source":5,"target":16,"value":2},
{"source":5,"target":37,"value":8},
{"source":5,"target":21,"value":6},
{"source":5,"target":27,"value":7},
{"source":6,"target":25,"value":3},
{"source":6,"target":29,"value":5},
{"source":6,"target":1,"value":8},
{"source":6,"target":34,"value":4},
{"source":6,"target":17,"value":6},
{"source":6,"target":9,"value":2},
{"source":6,"target":3,"value":12},
{"source":6,"target":16,"value":7},
{"source":6,"target":37,"value":10},
{"source":6,"target":27,"value":1},
{"source":7,"target":29,"value":6},
{"source":7,"target":36,"value":2},
{"source":7,"target":34,"value":1},
{"source":7,"target":17,"value":4},
{"source":7,"target":9,"value":10},
{"source":7,"target":3,"value":7},
{"source":7,"target":16,"value":5},
{"source":7,"target":37,"value":12},
{"source":7,"target":21,"value":8},
{"source":7,"target":27,"value":3},
{"source":8,"target":13,"value":1},
{"source":8,"target":24,"value":3},
{"source":8,"target":29,"value":5},
{"source":8,"target":9,"value":7},
{"source":8,"target":3,"value":8},
{"source":8,"target":16,"value":12},
{"source":8,"target":37,"value":10},
{"source":8,"target":21,"value":6},
{"source":8,"target":27,"value":4},
{"source":9,"target":12,"value":2},
{"source":9,"target":5,"value":5},
{"source":9,"target":24,"value":4},
{"source":9,"target":29,"value":7},
{"source":9,"target":36,"value":10},
{"source":9,"target":34,"value":8},
{"source":9,"target":18,"value":1},
{"source":9,"target":16,"value":6},
{"source":9,"target":37,"value":3},
{"source":9,"target":27,"value":12},
{"source":10,"target":5,"value":2},
{"source":10,"target":24,"value":5},
{"source":10,"target":29,"value":12},
{"source":10,"target":36,"value":7},
{"source":10,"target":34,"value":1},
{"source":10,"target":17,"value":4},
{"source":10,"target":9,"value":8},
{"source":10,"target":18,"value":6},
{"source":10,"target":37,"value":10},
{"source":10,"target":27,"value":3},
{"source":11,"target":13,"value":1},
{"source":11,"target":25,"value":7},
{"source":11,"target":4,"value":5},
{"source":11,"target":24,"value":3},
{"source":11,"target":29,"value":6},
{"source":11,"target":36,"value":2},
{"source":11,"target":9,"value":12},
{"source":11,"target":16,"value":4},
{"source":11,"target":21,"value":10},
{"source":11,"target":27,"value":8},
{"source":12,"target":5,"value":3},
{"source":12,"target":10,"value":6},
{"source":12,"target":29,"value":2},
{"source":12,"target":36,"value":8},
{"source":12,"target":34,"value":4},
{"source":12,"target":17,"value":10},
{"source":12,"target":9,"value":7},
{"source":12,"target":18,"value":5},
{"source":12,"target":16,"value":1},
{"source":12,"target":27,"value":12},
{"source":13,"target":25,"value":4},
{"source":13,"target":12,"value":3},
{"source":13,"target":5,"value":5},
{"source":13,"target":24,"value":2},
{"source":13,"target":29,"value":6},
{"source":13,"target":1,"value":7},
{"source":13,"target":28,"value":1},
{"source":13,"target":9,"value":12},
{"source":13,"target":3,"value":8},
{"source":13,"target":21,"value":10},
{"source":14,"target":23,"value":1},
{"source":14,"target":4,"value":5},
{"source":14,"target":24,"value":3},
{"source":14,"target":29,"value":6},
{"source":14,"target":1,"value":10},
{"source":14,"target":9,"value":7},
{"source":14,"target":3,"value":12},
{"source":14,"target":37,"value":8},
{"source":14,"target":21,"value":2},
{"source":14,"target":27,"value":4},
{"source":15,"target":12,"value":1},
{"source":15,"target":24,"value":5},
{"source":15,"target":29,"value":2},
{"source":15,"target":34,"value":3},
{"source":15,"target":17,"value":12},
{"source":15,"target":9,"value":10},
{"source":15,"target":18,"value":8},
{"source":15,"target":3,"value":4},
{"source":15,"target":16,"value":6},
{"source":15,"target":27,"value":7},
{"source":16,"target":4,"value":1},
{"source":16,"target":24,"value":3},
{"source":16,"target":28,"value":10},
{"source":16,"target":17,"value":2},
{"source":16,"target":9,"value":7},
{"source":16,"target":3,"value":12},
{"source":16,"target":37,"value":8},
{"source":16,"target":21,"value":6},
{"source":16,"target":27,"value":4},
{"source":16,"target":14,"value":5},
{"source":17,"target":5,"value":4},
{"source":17,"target":24,"value":8},
{"source":17,"target":1,"value":3},
{"source":17,"target":36,"value":5},
{"source":17,"target":9,"value":10},
{"source":17,"target":18,"value":6},
{"source":17,"target":3,"value":12},
{"source":17,"target":16,"value":1},
{"source":17,"target":37,"value":7},
{"source":17,"target":27,"value":2},
{"source":18,"target":13,"value":2},
{"source":18,"target":24,"value":5},
{"source":18,"target":29,"value":1},
{"source":18,"target":36,"value":8},
{"source":18,"target":28,"value":6},
{"source":18,"target":34,"value":4},
{"source":18,"target":9,"value":12},
{"source":18,"target":3,"value":7},
{"source":18,"target":37,"value":3},
{"source":18,"target":27,"value":10},
{"source":19,"target":23,"value":1},
{"source":19,"target":25,"value":3},
{"source":19,"target":5,"value":4},
{"source":19,"target":29,"value":10},
{"source":19,"target":36,"value":6},
{"source":19,"target":38,"value":7},
{"source":19,"target":34,"value":5},
{"source":19,"target":9,"value":12},
{"source":19,"target":3,"value":2},
{"source":19,"target":37,"value":8},
{"source":20,"target":25,"value":1},
{"source":20,"target":12,"value":4},
{"source":20,"target":4,"value":3},
{"source":20,"target":29,"value":7},
{"source":20,"target":15,"value":5},
{"source":20,"target":9,"value":8},
{"source":20,"target":3,"value":12},
{"source":20,"target":16,"value":2},
{"source":20,"target":37,"value":10},
{"source":20,"target":27,"value":6},
{"source":21,"target":23,"value":6},
{"source":21,"target":25,"value":4},
{"source":21,"target":33,"value":2},
{"source":21,"target":24,"value":10},
{"source":21,"target":28,"value":1},
{"source":21,"target":17,"value":3},
{"source":21,"target":9,"value":12},
{"source":21,"target":16,"value":7},
{"source":21,"target":37,"value":5},
{"source":21,"target":27,"value":8},
{"source":22,"target":5,"value":2},
{"source":22,"target":10,"value":10},
{"source":22,"target":24,"value":5},
{"source":22,"target":29,"value":12},
{"source":22,"target":34,"value":4},
{"source":22,"target":9,"value":6},
{"source":22,"target":3,"value":3},
{"source":22,"target":16,"value":1},
{"source":22,"target":37,"value":7},
{"source":22,"target":27,"value":8},
{"source":23,"target":10,"value":3},
{"source":23,"target":4,"value":1},
{"source":23,"target":29,"value":7},
{"source":23,"target":36,"value":4},
{"source":23,"target":17,"value":5},
{"source":23,"target":9,"value":2},
{"source":23,"target":3,"value":12},
{"source":23,"target":37,"value":10},
{"source":23,"target":27,"value":6},
{"source":23,"target":14,"value":8},
{"source":24,"target":4,"value":2},
{"source":24,"target":1,"value":1},
{"source":24,"target":28,"value":7},
{"source":24,"target":38,"value":5},
{"source":24,"target":9,"value":6},
{"source":24,"target":3,"value":12},
{"source":24,"target":16,"value":4},
{"source":24,"target":37,"value":10},
{"source":24,"target":21,"value":8},
{"source":24,"target":27,"value":3},
{"source":25,"target":4,"value":4},
{"source":25,"target":29,"value":7},
{"source":25,"target":1,"value":1},
{"source":25,"target":28,"value":10},
{"source":25,"target":34,"value":5},
{"source":25,"target":9,"value":6},
{"source":25,"target":3,"value":8},
{"source":25,"target":37,"value":12},
{"source":25,"target":27,"value":2},
{"source":25,"target":14,"value":3},
{"source":26,"target":25,"value":5},
{"source":26,"target":4,"value":3},
{"source":26,"target":29,"value":7},
{"source":26,"target":28,"value":1},
{"source":26,"target":9,"value":10},
{"source":26,"target":3,"value":12},
{"source":26,"target":16,"value":8},
{"source":26,"target":21,"value":6},
{"source":26,"target":27,"value":4},
{"source":26,"target":14,"value":2},
{"source":27,"target":5,"value":3},
{"source":27,"target":24,"value":10},
{"source":27,"target":36,"value":8},
{"source":27,"target":28,"value":6},
{"source":27,"target":34,"value":12},
{"source":27,"target":17,"value":2},
{"source":27,"target":9,"value":7},
{"source":27,"target":18,"value":4},
{"source":27,"target":16,"value":5},
{"source":27,"target":37,"value":1},
{"source":28,"target":25,"value":12},
{"source":28,"target":24,"value":5},
{"source":28,"target":36,"value":2},
{"source":28,"target":38,"value":3},
{"source":28,"target":9,"value":6},
{"source":28,"target":3,"value":10},
{"source":28,"target":16,"value":7},
{"source":28,"target":37,"value":4},
{"source":28,"target":21,"value":1},
{"source":28,"target":27,"value":8},
{"source":29,"target":25,"value":6},
{"source":29,"target":5,"value":8},
{"source":29,"target":1,"value":2},
{"source":29,"target":36,"value":3},
{"source":29,"target":9,"value":4},
{"source":29,"target":3,"value":12},
{"source":29,"target":16,"value":10},
{"source":29,"target":37,"value":1},
{"source":29,"target":27,"value":7},
{"source":29,"target":14,"value":5},
{"source":30,"target":13,"value":8},
{"source":30,"target":12,"value":3},
{"source":30,"target":5,"value":5},
{"source":30,"target":24,"value":10},
{"source":30,"target":1,"value":1},
{"source":30,"target":17,"value":6},
{"source":30,"target":3,"value":2},
{"source":30,"target":16,"value":12},
{"source":30,"target":21,"value":4},
{"source":30,"target":27,"value":7},
{"source":31,"target":25,"value":6},
{"source":31,"target":5,"value":3},
{"source":31,"target":29,"value":8},
{"source":31,"target":34,"value":1},
{"source":31,"target":17,"value":2},
{"source":31,"target":9,"value":12},
{"source":31,"target":3,"value":5},
{"source":31,"target":37,"value":10},
{"source":31,"target":21,"value":4},
{"source":31,"target":27,"value":7},
{"source":32,"target":5,"value":2},
{"source":32,"target":29,"value":10},
{"source":32,"target":36,"value":7},
{"source":32,"target":38,"value":1},
{"source":32,"target":34,"value":6},
{"source":32,"target":9,"value":12},
{"source":32,"target":18,"value":4},
{"source":32,"target":3,"value":3},
{"source":32,"target":21,"value":8},
{"source":32,"target":27,"value":5},
{"source":33,"target":25,"value":2},
{"source":33,"target":24,"value":1},
{"source":33,"target":29,"value":6},
{"source":33,"target":15,"value":3},
{"source":33,"target":38,"value":4},
{"source":33,"target":9,"value":8},
{"source":33,"target":3,"value":7},
{"source":33,"target":37,"value":10},
{"source":33,"target":21,"value":12},
{"source":33,"target":27,"value":5},
{"source":34,"target":5,"value":7},
{"source":34,"target":29,"value":5},
{"source":34,"target":36,"value":8},
{"source":34,"target":28,"value":4},
{"source":34,"target":38,"value":1},
{"source":34,"target":17,"value":3},
{"source":34,"target":9,"value":10},
{"source":34,"target":18,"value":6},
{"source":34,"target":27,"value":12},
{"source":35,"target":15,"value":1},
{"source":35,"target":36,"value":4},
{"source":35,"target":38,"value":2},
{"source":35,"target":17,"value":10},
{"source":35,"target":9,"value":3},
{"source":35,"target":18,"value":5},
{"source":35,"target":3,"value":6},
{"source":35,"target":16,"value":8},
{"source":35,"target":21,"value":12},
{"source":35,"target":27,"value":7},
{"source":36,"target":5,"value":12},
{"source":36,"target":24,"value":8},
{"source":36,"target":29,"value":4},
{"source":36,"target":34,"value":3},
{"source":36,"target":17,"value":7},
{"source":36,"target":9,"value":10},
{"source":36,"target":3,"value":2},
{"source":36,"target":16,"value":1},
{"source":36,"target":37,"value":5},
{"source":36,"target":27,"value":6},
{"source":37,"target":23,"value":1},
{"source":37,"target":25,"value":8},
{"source":37,"target":4,"value":12},
{"source":37,"target":24,"value":2},
{"source":37,"target":29,"value":4},
{"source":37,"target":1,"value":6},
{"source":37,"target":9,"value":5},
{"source":37,"target":3,"value":10},
{"source":37,"target":27,"value":3},
{"source":37,"target":14,"value":7},
{"source":38,"target":5,"value":3},
{"source":38,"target":24,"value":7},
{"source":38,"target":29,"value":10},
{"source":38,"target":36,"value":6},
{"source":38,"target":28,"value":4},
{"source":38,"target":9,"value":12},
{"source":38,"target":18,"value":2},
{"source":38,"target":16,"value":8},
{"source":38,"target":37,"value":5}
]
}

index.html

<!DOCTYPE html>
<meta charset="utf-8">
<style>
 
.node {
stroke: #fff;
stroke-width: 1.5px;
}
 
.link {
stroke: #999;
stroke-opacity: .2;
}
 
</style>
<body>
<script src="http://d3js.org/d3.v3.min.js"></script>
<script>
 
var width = 960,
height = 500;
 
var color = d3.scale.category20();
 
var force = d3.layout.force()
.charge(-400)
.linkDistance(100)
.size([width, height]);
 
var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);
 
d3.json("data.json", function(error, graph) {
force
.nodes(graph.nodes)
.start();
 
var link = svg.selectAll(".link")
.data(graph.links)
.enter().append("line")
.attr("class", "link")
.style("stroke-width", function(d) { return Math.sqrt(d.value); });
 
var node = svg.selectAll(".node")
.data(graph.nodes)
.enter().append("circle")
.attr("class", "node")
.attr("r", 10)
.style("fill", function(d) { return color(d.group); })
.call(force.drag);
 
node.append("title")
.text(function(d) { return d.name; });
 
force.on("tick", function() {
link.attr("x1", function(d) { return d.source.x; })
.attr("y1", function(d) { return d.source.y; })
.attr("x2", function(d) { return d.target.x; })
.attr("y2", function(d) { return d.target.y; });
 
node.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; });
});
});
 
</script>
</body>
</html>