Skip to content

Instantly share code, notes, and snippets.

@martgnz

martgnz/.block

Last active October 28, 2017 15:34
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 martgnz/cce95512ca18c226b4cc to your computer and use it in GitHub Desktop.
Save martgnz/cce95512ca18c226b4cc to your computer and use it in GitHub Desktop.
Download ZIP
World Map
Raw
.block
license: mit
border: none
Raw
README.md
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8" />
<body>
<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="https://d3js.org/topojson.v1.min.js"></script>
<script src="https://unpkg.com/rbush@1.4.3/rbush.js"></script>
<script src="https://unpkg.com/d3-geo-projection@0.2.16/d3.geo.projection.min.js"></script>
<script src="https://unpkg.com/spamjs@1.1.0/spam.min.js"></script>
<script type='text/javascript'>
var graticule = d3.geo.graticule();
d3.json("https://unpkg.com/world-atlas@1.1.4/world/50m.json", function(err, d) {
topojson.presimplify(d);
var map = new StaticCanvasMap({
element: "body",
width: 960,
projection: d3.geo.robinson(),
data: [
{
features: topojson.feature(d, d.objects["countries"]),
static: {
prepaint: function(parameters) {
parameters.context.beginPath();
parameters.path(graticule());
parameters.context.lineWidth = 0.5;
parameters.context.strokeStyle = "rgb(170,170,170)";
parameters.context.stroke();
parameters.context.beginPath();
parameters.path(graticule.outline());
parameters.context.lineWidth = 1;
parameters.context.strokeStyle = "rgb(30,30,30)";
parameters.context.stroke();
},
paintfeature: function(parameters, d) {
parameters.context.lineWidth = 0.5 / parameters.scale;
parameters.context.strokeStyle = "rgb(255,255,255)";
parameters.context.stroke();
parameters.context.fillStyle = "#111";
parameters.context.fill();
}
}
}
]
});
map.init();
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment