D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
asifm
Full window
Github gist
Map of USA: Albers Projection
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>United States: Albers Projection</title> <script type="text/javascript" src="//d3js.org/d3.v3.min.js"></script> <style type="text/css"> .state { fill: steelblue; } </style> </head> <body> <h1>United States: Albers Projection</h1> <div id="us-map"></div> <script type="text/javascript"> var width = 1050; var height = 500; var projection = d3.geo.albersUsa() .translate([width / 2, height / 2]) .scale(1000); var path = d3.geo.path() .projection(projection); var svg = d3.select("#us-map").append("svg") .attr("width", width) .attr("height", height) var g = svg.append("g") d3.json("us-states.json", function(error, us_states) { g.selectAll("path") .data(us_states.features) .enter() .append("path") .attr("class", "state") .attr("d", path) }) </script> </body> </html>
https://d3js.org/d3.v3.min.js