Skip to content

Instantly share code, notes, and snippets.

Last active February 9, 2016 02:01
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
What would you like to do?
Population Choropleth
license: gpl-3.0

Note: the counties aren’t clipped to water boundaries, so they look a bit weird and the corresponding density calculation is inaccurate. So don’t copy this example without fixing those problems first, ok? See the us-atlas project for a more comprehensive Makefile of examples, and the projected choropleth example for a better style. Also, you’ll want to add a legend for the color scale.

To build this example, git clone this repo, npm install, and then make.

<!DOCTYPE html>
<meta charset="utf-8">
<script src="//"></script>
<script src="//"></script>
var width = 960,
height = 500;
var color = d3.scale.log()
.range(["hsl(62,100%,90%)", "hsl(228,30%,20%)"])
var path = d3.geo.path()
var svg ="body").append("svg")
.attr("width", width)
.attr("height", height);
d3.json("us-albers.json", function(error, us) {
if (error) throw error;
var counties = topojson.feature(us, us.objects.counties).features;
var densities = counties
.map(function(d) { return = / path.area(d); })
.sort(function(a, b) { return a - b; });
color.domain([d3.quantile(densities, .01), d3.quantile(densities, .99)]);
.attr("class", "counties")
.style("fill", function(d) { return color(; })
.attr("d", path);
all: \
rm -rf -- County_2010Census_DP1.*
curl -o $@ --raw ''
rm -rf $(basename $@)
mkdir -p $(basename $@)
unzip -d $(basename $@) $<
for file in $(basename $@)/*; do chmod 644 $$file; mv $$file $(basename $@).$${file##*.}; done
rmdir $(basename $@)
touch $@
# projected (giving node extra memory since input shapefile is big)
us-albers.json: County_2010Census_DP1.shp
node --max_old_space_size=8192 node_modules/.bin/topojson \
-q 1e5 \
-s 1 \
--projection 'd3.geo.albersUsa()' \
--id-property=GEOID10 \
-p name=NAMELSAD10,pop=+DP0010001 \
-o $@ \
-- counties=County_2010Census_DP1.shp
# non-projected (not used by this example, but included for reference)
us.json: County_2010Census_DP1.shp
node_modules/.bin/topojson \
-q 1e5 \
-s 7e-7 \
--id-property=GEOID10 \
-p name=NAMELSAD10,pop=+DP0010001 \
-o $@ \
-- counties=County_2010Census_DP1.shp
"name": "anonymous",
"version": "0.0.1",
"private": true,
"devDependencies": {
"topojson": "1"
Display the source blob
Display the rendered blob
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