d3 map shows empty with seemingly valid topojson data

Question

I followed this example : http://bost.ocks.org/mike/map/

to display this topojson file :

https://github.com/max-l/topojson-experiments/blob/master/qc-map.json

the map is always empty, I tried setting the proper center d3.geo.albers().center(-71,45) and many other things without success.

I noticed that Github is able to render it (with leaflet)

https://github.com/max-l/topojson-experiments/blob/master/qc-map.json

which makes me assume it is valid topojson..

user1614080 user1614080 · Accepted Answer · 2013-09-26T05:55:14

I'd guess its a projection issue. The co-ordinates in the topojson and your center look like they are WSG84 or Mercator co-ordinates (the America's are expressed as negative longitudes) and they are similar to the coordinates in this question. WSG84 is generally a safe guess for projections particularity for things like Google Maps, although Albers is commonly used for North America.

I've made a gist using Mercator which displays the map and you can see the block here.

d3 map shows empty with seemingly valid topojson data

1 Answers