jakekara / us-atlas

Pre-built TopoJSON from the U.S. Census Bureau.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

U.S. Atlas TopoJSON

This repository provides a convenient mechanism for generating TopoJSON files from the Census Bureau’s cartographic boundary shapefiles, 2015 edition.

Usage

In a browser (using d3-geo and SVG), bl.ocks.org/4108203:

<!DOCTYPE html>
<svg width="960" height="600" fill="none" stroke="#000" stroke-linejoin="round" stroke-linecap="round"></svg>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://unpkg.com/topojson-client@3"></script>
<script>

var svg = d3.select("svg");

var path = d3.geoPath();

d3.json("https://unpkg.com/us-atlas@1/us/10m.json", function(error, us) {
  if (error) throw error;

  svg.append("path")
      .attr("stroke", "#aaa")
      .attr("stroke-width", 0.5)
      .attr("d", path(topojson.mesh(us, us.objects.counties, function(a, b) { return a !== b && (a.id / 1000 | 0) === (b.id / 1000 | 0); })));

  svg.append("path")
      .attr("stroke-width", 0.5)
      .attr("d", path(topojson.mesh(us, us.objects.states, function(a, b) { return a !== b; })));

  svg.append("path")
      .attr("d", path(topojson.feature(us, us.objects.nation)));
});

</script>

In a browser (using d3-geo and Canvas), bl.ocks.org/3783604:

<!DOCTYPE html>
<canvas width="960" height="600"></canvas>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="https://unpkg.com/topojson-client@3"></script>
<script>

var context = d3.select("canvas").node().getContext("2d"),
    path = d3.geoPath().context(context);

d3.json("https://unpkg.com/us-atlas@1/us/10m.json", function(error, us) {
  if (error) throw error;

  context.beginPath();
  path(topojson.mesh(us));
  context.stroke();
});

</script>

In Node (using d3-geo and node-canvas), bl.ocks.org/885fffe88d72b2a25c090e0bbbef382f:

var fs = require("fs"),
    d3 = require("d3-geo"),
    topojson = require("topojson-client"),
    Canvas = require("canvas"),
    us = require("./node_modules/us-atlas/us/10m.json");

var canvas = new Canvas(960, 600),
    context = canvas.getContext("2d"),
    path = d3.geoPath().context(context);

context.beginPath();
path(topojson.mesh(us));
context.stroke();

canvas.pngStream().pipe(fs.createWriteStream("preview.png"));

File Reference

# us/10m.json <>

A TopoJSON topology containing three geometry collections: counties, states, and nation. The geometry is quantized, projected using d3.geoAlbersUsa to fit a 960×600 viewport, and simplified. This topology is derived from the Census Bureau’s cartographic county boundaries, 2015 edition. The state boundaries are computed by merging counties, and the nation boundary is computed by merging states, ensuring a consistent topology.

# us.objects.counties

# us.objects.states

# us.objects.nation

About

Pre-built TopoJSON from the U.S. Census Bureau.

License:Other


Languages

Language:Shell 100.0%