Skip to content

Instantly share code, notes, and snippets.

@mbostock
Last active December 5, 2023 16:36
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save mbostock/2dd741099154a4da55a7db31fd96a892 to your computer and use it in GitHub Desktop.
Streaming Shapefile
license: gpl-3.0
height: 600
redirect: https://observablehq.com/@mbostock/streaming-shapefiles

This is a 12.9MB shapefile! If your browser supports streaming fetch, it will start being displayed even before it has finished downloading. Streaming in-browser parsing is new in shapefile 0.5.

<!DOCTYPE html>
<canvas width="960" height="600"></canvas>
<script src="https://unpkg.com/d3-array@1"></script>
<script src="https://unpkg.com/d3-geo@1"></script>
<script src="https://unpkg.com/d3-geo-projection@2"></script>
<script src="https://unpkg.com/shapefile@0.6"></script>
<script>
var canvas = document.querySelector("canvas"),
context = canvas.getContext("2d");
var path = d3.geoPath()
.context(context)
.projection(d3.geoAlbersUsa()
.scale(1285)
.translate([canvas.width / 2, canvas.height / 2]));
context.lineWidth = 0.5;
shapefile.open("https://cdn.rawgit.com/matplotlib/basemap/v1.1.0/lib/mpl_toolkits/basemap/data/UScounties.shp", null)
.then(function(source) {
return source.read().then(function next(result) {
if (result.done) return;
context.beginPath();
path(result.value);
context.stroke();
return source.read().then(next);
});
})
.catch(function(error) {
console.error(error.stack);
});
</script>
@ralexrdz
Copy link

ralexrdz commented Dec 5, 2023

I used to think shapefiles are always zipped together with at least dbf and shx files. How do you join them to a single one?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment