Skip to content
forked from mapbox/geojson-vt

Slice GeoJSON into vector tiles on the fly in the browser

License

Notifications You must be signed in to change notification settings

gijs/geojson-vt

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

88 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

geojson-vt — GeoJSON Vector Tiles

A highly efficient JavaScript library for slicing GeoJSON data into vector tiles on the fly, primarily designed to enable rendering and interacting with large geospatial datasets on the browser side (without a server).

Created to power GeoJSON in Mapbox GL JS, but can be useful in other visualization platforms like Leaflet and d3. It can also be easily used on the server as well.

Resulting tiles conform to the JSON equivalent of the vector tile specification. To make data rendering and interaction fast, the tiles are simplified, retaining the minimum level of detail appropriate for each zoom level (simplifying shapes, filtering out tiny polygons and polylines).

Demo

Here's geojson-vt action in Mapbox GL JS, dynamically loading a 100Mb US zip codes GeoJSON with 5.4 million points:

There's a convenient debug page to test out geojson-vt on different data. Make sure you have the dev version built; open debug/index.html in your browser, and drag any GeoJSON on the page, watching the console.

Usage

// build an initial index of tiles
var tileIndex = geojsonvt(geoJSON);

// request a particular tile
var features = tileIndex.getTile(z, x, y).features;

Options

You can fine-tune the results with an options object, although the defaults are sensible and work well for most use cases.

var tileIndes = geojsonvt(data, {
	baseZoom: 14,   // max zoom to preserve detail on
	maxZoom: 4,     // zoom to slice down to on first pass
	maxPoints: 100, // stop slicing each tile below this number of points
	tolerance: 3,   // simplification tolerance (higher means simpler)
	extent: 4096,   // tile extent (both width and height)
	buffer: 64,		// tile buffer on each side
	debug: 0        // logging level (0 to disable, 1 or 2)
});

Browser builds

npm install
npm run build-dev # development build, used by the debug page
npm run build-min # minified production build

About

Slice GeoJSON into vector tiles on the fly in the browser

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%