O'Reilly logo

Expert Data Visualization by Jos Dirksen

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Rendering the map

First let's look at how we can render the map:

function process (topo) {      // first remove everything, cause we might have        switched projection     map.selectAll("path").remove();      // define a custom feature, which creates the outline of the map     var f = {type: "Sphere"}     // first remove everything, cause we might have switched projection     projection.fitSize([width, height], f)      // create a path and draw it.     var outline = path(f);     map.append("path").attr("class", "sphere").attr("d", outline);      // first display all the counties.     map.selectAll(".country")         .data(topojson.feature(topo, topo.objects.countries).features)         .enter()         .append("path")         .attr("class","country")         .attr("d", path)      // add lines  map.append("path").datum(d3.geoGraticule()()) ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required