Skip to content

Instantly share code, notes, and snippets.

@barnabemonnot

barnabemonnot/malta.html

Created April 6, 2016 07:18
Show Gist options
  • Save barnabemonnot/a1a226a04404f642906436e1dddcba85 to your computer and use it in GitHub Desktop.
Save barnabemonnot/a1a226a04404f642906436e1dddcba85 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
malta.html
<!DOCTYPE html>
<html>
<meta>
<title>Malta</title>
<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
</meta>
<body>
<div id="viz"></div>
</body>
<script>
var w = 800;
var h = 800;
var svg = d3.select("#viz").append("svg").attr("width", w).attr("height", h);
svg.append("rect").attr("x", 0).attr("y", 0).attr("width", w).attr("height", h).attr("fill", "#ccc");
//CREATE GROUPS
d3.json("http://barnabemonnot.com/api/d3/malta", function(err, data) {
var projection = d3.geo.mercator()
.scale(1)
.translate([0, 0]);
var path = d3.geo.path()
.projection(projection);
var b = path.bounds(data.features[0]),
s = .95 / Math.max((b[1][0] - b[0][0]) / w, (b[1][1] - b[0][1]) / h),
t = [(w - s * (b[1][0] + b[0][0])) / 2, (h - s * (b[1][1] + b[0][1])) / 2];
projection.scale(s).translate(t);
// ADD BORDERS
d3.json("http://barnabemonnot.com/api/d3/maltapoi", function(err, poi) {
// ADD POINTS
// ADD TEXT
});
});
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment