Skip to content

Instantly share code, notes, and snippets.

@veltman
Created July 12, 2016 22:33
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 veltman/a1d532a697764f05d0093dec40c571b2 to your computer and use it in GitHub Desktop.
Save veltman/a1d532a697764f05d0093dec40c571b2 to your computer and use it in GitHub Desktop.
Broken Gnomonic
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.land {
fill: #222;
}
</style>
<svg width="960" height="960"></svg>
<script src="//d3js.org/d3.v4.min.js"></script>
<script src="//d3js.org/topojson.v1.min.js"></script>
<script>
var svg = d3.select("svg"),
width = +svg.attr("width"),
height = +svg.attr("height"),
g = svg.append("g").attr("transform", "rotate(90 480,480)");
var projection = d3.geoGnomonic()
.clipAngle(90 - 1e-3)
.scale(150)
.translate([width / 2, height / 2])
.precision(.1);
var path = d3.geoPath()
.projection(projection);
d3.json("https://gist.githubusercontent.com/mbostock/4090846/raw/07e73f3c2d21558489604a0bc434b3a5cf41a867/world-50m.json", function(error, world) {
if (error) throw error;
var land = topojson.feature(world, world.objects.land);
var b = path.bounds(land),
s = 1 / Math.max((b[1][0] - b[0][0]) / width, (b[1][1] - b[0][1]) / height),
t = [(width - s * (b[1][0] + b[0][0])) / 2, (height - s * (b[1][1] + b[0][1])) / 2];
projection
.scale(s)
.translate(t);
g.append("path")
.datum(land)
.attr("class", "land")
.attr("d", path);
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment