Skip to content

Instantly share code, notes, and snippets.

@bradoyler

bradoyler/.block

Created September 17, 2016 01:42
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 bradoyler/bae6adf4e1e74c925ea20bf6026614b3 to your computer and use it in GitHub Desktop.
Save bradoyler/bae6adf4e1e74c925ea20bf6026614b3 to your computer and use it in GitHub Desktop.
Download ZIP
us-states via Atlas-make
Raw
.block
license: mit
Raw
index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<script src="https://d3js.org/d3.v3.min.js"></script>
<script src="//d3js.org/topojson.v1.min.js"></script>
<style>
.mesh{ fill: #fff; stroke: #333; stroke-width: .8px;stroke-linejoin: round;}
</style>
</head>
<body>
<script>
// topojson via https://github.com/bradoyler/atlas-make
var svg = d3.select("body").append("svg")
var width = 960,height = 500;
var projection = d3.geo.albersUsa();
var path = d3.geo.path().projection(projection);
d3.json("us-states.json", function(error, ustopo) {
if (error) throw error;
svg.attr("width", width)
.attr("height", height)
.append("path")
.datum(topojson.mesh(ustopo))
.attr("class", "mesh")
.attr("d", path);
});
</script>
</body>
Display the source blob
Display the rendered blob
Raw
us-states.json
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment