Skip to content

Instantly share code, notes, and snippets.

@warrendunlop
Created February 28, 2013 19:58
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save warrendunlop/5059605 to your computer and use it in GitHub Desktop.
Save warrendunlop/5059605 to your computer and use it in GitHub Desktop.
Current world map setup.
<div id="map_container" style="width:300px; height:117px;"></div>
<script>
(function(window) {
var width = $('#map_container').width();
var height = $('#map_container').height();
var data,
xy = d3
.geo
.equirectangular()
// .scale($('#map_container').width())
// .translate([$('#map_container').width() / 2, $('#map_container').height() / 2]),
path = d3
.geo
.path()
.projection(xy),
svg = d3
.select('#map_container')
.append('svg:svg'),
countries = svg
.append('svg:g')
.attr('id', 'countries')
.attr('transform', "translate(" + (0-(width/2)) + ", " + (0-(height/2)) + ") scale(" + (width/503) + "," + (width/503) + ")");
/* World Map */
countries.selectAll('path')
.data(window.countries_data.features)
.enter()
.append('svg:path')
.attr('d', path)
.attr('fill', '#ddd')
.attr('stroke', '#fff')
.attr('stroke-width', .5);
}(this));
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment