dimanche 1 février 2015

Let's make a map Topojson doesn't appear - no error msgs but nothing happens


I want to use D3 to plot a map of Brazil (state boundaries) but I'm failing. The map is in Topojson format (it's here) and I'm following Mike Bostock's tutorial. I can replicate the tutorial results exactly when plotting the UK (map here), but when I try plotting Brazil nothing happens - and there are no error messages in the JavaScript console.


Here's my code:



<!DOCTYPE html>
<meta charset="utf-8">
<body>
<script src="http://ift.tt/JmLP3T"></script>
<script src="http://ift.tt/JmLP3U"></script>
<script>

var width = 960,
height = 1160;

var projection = d3.geo.albers()
.center([0, 55.4])
.rotate([4.4, 0])
.parallels([50, 60])
.scale(1200 * 5)
.translate([width / 2, height / 2]);

var path = d3.geo.path()
.projection(projection);

var svg = d3.select("body").append("svg")
.attr("width", width)
.attr("height", height);

/*
PLOTTING THE UK WORKS
d3.json("uk.json", function(error, uk) {
console.log(uk)
svg.append("path")
.datum(topojson.feature(uk, uk.objects.subunits))
.attr("d", path);
});
*/

/* PLOTTING BRAZIL DOESN'T WORK */
d3.json("br-states.json", function(error, uf) {
console.log(uf)
svg.append("path")
.datum(topojson.feature(uf, uf.objects.states))
.attr("d", path);
});

</script>
</body>




Aucun commentaire:

Enregistrer un commentaire