geojson-vt

What is geojson-vt?

The geojson-vt package is a library for slicing GeoJSON into vector tiles on the fly. It's primarily designed to handle large amounts of data by cutting them into smaller, more manageable pieces called 'tiles'. These tiles can then be used for efficient rendering and manipulation on map interfaces.

What are geojson-vt's main functionalities?

Slicing GeoJSON into vector tiles

This feature allows you to convert a GeoJSON object into vector tiles. You can then retrieve specific tiles by their x, y, and z coordinates.

const geojsonVt = require('geojson-vt');
const geojsonData = {
  type: 'FeatureCollection',
  features: [...]
};
const options = {};
const tileIndex = geojsonVt(geojsonData, options);
const tile = tileIndex.getTile(z, x, y);

Custom tile generation options

This feature allows you to customize how the GeoJSON data is sliced into vector tiles, including the level of detail, simplification tolerance, and tile dimensions.

const options = {
  maxZoom: 17,  // max zoom to preserve detail on; can't be higher than 24
  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)
  lineMetrics: false, // whether to enable line metrics tracking for LineString/MultiLineString features
  promoteId: null,   // name of a feature property to promote to feature.id
  generateId: false, // whether to generate feature ids. Cannot be used with promoteId
  indexMaxZoom: 5,       // max zoom in the initial tile index
  indexMaxPoints: 100000 // max number of points per tile in the index
};
const tileIndex = geojsonVt(geojsonData, options);

On-the-fly tile generation

This feature allows you to generate tiles on demand, rather than processing an entire set of tiles upfront. This can be more efficient when dealing with large datasets.

const tile = tileIndex.getTile(z, x, y);
if (!tile) {
  console.log('Tile not found');
} else {
  console.log('Generated tile:', tile);
}

Other packages similar to geojson-vt

mapshaper

Mapshaper is a tool for editing and converting vector map data. It has a web interface and a command-line tool. While it can simplify and convert data formats, it doesn't specifically slice data into vector tiles like geojson-vt does, but it can be used for preprocessing data before using it with geojson-vt.

README

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, as well as Node.js server applications.

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).

Read more on how the library works on the Mapbox blog.

There's a C++11 port: geojson-vt-cpp

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. Just 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;

// show an array of tile coordinates created so far
console.log(tileIndex.tileCoords); // [{z: 0, x: 0, y: 0}, ...]

Options

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

var tileIndex = geojsonvt(data, {
	maxZoom: 14,  // max zoom to preserve detail on
	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)

	indexMaxZoom: 4,        // max zoom in the initial tile index
	indexMaxPoints: 100000, // max number of points per tile in the index
	solidChildren: false    // whether to include solid tile children in the index
});

Browser builds

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

Changelog

2.1.8 (Nov 9, 2015)

• Fixed a bug where getTile would initially return null when requesting a child of a solid clipped square tile.

2.1.7 (Oct 16, 2015)

• Expose transform methods in a separate file (transform.js).

2.1.6 (Sep 22, 2015)

• Fixed a bug where getTile could generate a lot of unnecessary tiles.
• Fixed a bug where an empty GeoJSON generated tiles.

2.1.5 (Aug 14, 2015)

• Added tileCoords property with an array of coordinates of all tiles created so far.

2.1.4 (Aug 14, 2015)

• Improved getTile to always return null on non-existing or invalid tiles.

2.1.3 (Aug 13, 2015)

• Added solidChildren option that includes children of solid filled square tiles in the index (off by default).
• Added back solid tile heuristics (not tiling solid filled square tiles further).

2.1.2 (Aug 13, 2015)

• Fixed a crazy slowdown (~30x) when generating a huge number of tiles on the first run.
• Removed clipped solid square heuristics (that actually didn't work since 2.0.0).

2.1.1 (June 18, 2015)

• Fixed duplicate points in polygons.

2.1.0 (June 15, 2015)

• Added proper handling for features crossing or near the date line.

2.0.1 (June 9, 2015)

• 10-20% faster tile indexing.
• Fixed latitude extremes not being clamped.

2.0.0 (Mar 20, 2015)

• Breaking: maxZoom renamed to indexMaxZoom, maxPoints to indexMaxPoints, baseZoom to maxZoom.
• Improved performance of both indexing and on-demand tile requests.
• Improved memory footprint.
• Better indexing defaults.
• Fixed a bug where unnecessary memory was retained in some cases.

1.1.0 (Mar 2, 2015)

• Add buffer and extent options.

1.0.0 (Dec 8, 2014)

• Initial release.