Leaflet.VectorGrid

Display gridded vector data (sliced GeoJSON, TopoJSON or protobuf vector tiles) in Leaflet 1.0.0

Demos

| | | | --- | --- | | demo-geojson.html | Sliced GeoJSON | | demo-topojson.html | Sliced TopoJSON (sorry for the antimeridian mess, topojson-to-geojson seems to not handle it properly) | | demo-vectortiles.html | Protobuf vector tiles: OpenMapTiles, MapBox, MapZen or even ESRI vector tiles | | demo-points.html | Clickable points and lines | | demo-points-icons.html | Points as icons |

Using

If you use npm:

    npm install leaflet.vectorgrid

That will make available two files: dist/Leaflet.VectorGrid.js and dist/Leaflet.VectorGrid.bundled.js.

The difference is that dist/Leaflet.VectorGrid.bundled.js includes all of VectorGrid's dependencies:

• geojson-vt (Under ISC license)
• pbf (Under BSD license)
• topojson (Under BSD license)

• vector-tile (Under BSD license)

  If you are adding these dependencies by yourself, use dist/Leaflet.VectorGrid.js instead.

If you don't want to deal with npm and local files, you can use unpkg.com instead:

<script src="https://unpkg.com/leaflet.vectorgrid@latest/dist/Leaflet.VectorGrid.bundled.js"></script>

or, with the same caveats about bundled dependencies:

<script src="https://unpkg.com/leaflet.vectorgrid@latest/dist/Leaflet.VectorGrid.js"></script>

Docs

This plugin exposes two new classes:

• L.VectorGrid.Slicer for displaying GeoJSON or TopoJSON data
• L.VectorGrid.Protobuf for displaying vector tiles from an online tile server

You can find the API documentation, and the explanation about the styling, at:

http://leaflet.github.io/Leaflet.VectorGrid/vectorgrid-api-docs.html

Dependencies

L.VectorGrid.Slicer requires geojson-vt: the global variable geojsonvt must exist. If topojson data is used, then the topojson global variable must also exist.

L.VectorGrid.Protobuf requires vector-tile and pbf: the global variables VectorTile and Pbf must exist.

By default, VectorGrid is built with those dependencies bundled.

Developing

Run npm install.

TODO

• Sub-panes for the tile renderers (to set the "z-index" of layers/features)
  • More <g>roups in SVG
  • Offscreen <canvas>es in Canvas
• getBounds() support for the slicer (inherit/extrapolate from geojson data)
• Parser for mapbox-like vector stylesheets

Motivation

Before VectorGrid, loading vector tiles in Leaflet could only be done with the Leaflet.MapboxVectorTile or the Hoverboard plugin, but neither of those works with Leaflet 1.0.0 (or greater).

VectorGrid leverages the GridLayer feature introduced in Leaflet 1.0.0.

Legalese

"THE BEER-WARE LICENSE": ivan@sanchezortega.es wrote this file. As long as you retain this notice you can do whatever you want with this stuff. If we meet some day, and you think this stuff is worth it, you can buy me a beer in return.

1.3.0 (2017-08-18)

• Build using Rollup (#29 by @IvanSanchez)
• Remember overridden styles between draw calls (#38 by @perliedman)
• Fix quirks in setFeatureStyle (#42 by @lediur)
• Allow points to be styled as icons (#44 by @perliedman)
• Support TMS URLs for protobuf tiles (#47 by @minus34)
• Documentation for styling points as icons (#48 by @frodrigo
• Fix race condition when a tile layer is removed before its tiles have loaded (#57 by @micahcatlin)
• Fix handling of coordinates from GeoJSON points (#32, #62 by @vmeurisse)
• Use standard for loops in preference over for...in (#27, #70 by @perliedman)
• Clean up map's interactive targets when tiles are removed (#73 by @jkuebart)
• Make features, not tiles, accept pointer events for SVG renderer (#75 by @jkuebart)
• Simplification of style updates (#72 by @jkuebart)
• Port canvas mouse handling fixes from Leaflet master to canvas renderer (#78 by @jkuebart)
• Split FeatureLayer into Symbolizers (by @IvanSanchez)
• Add Leafdoc documentation (by @IvanSanchez)
• Add ability to specify options for fetch, adds cookie capability for example (#100 by @tlaitinen)
• Add setUrl method to L.VectorGrid.Protobuf (#105 by @frodrigo)

1.2.0

• Refactored the code modules into ES6 modules
• Switched the build system and dependencies to use RollupJS
• Store styles set through setFeatureStyle so the changes persist after zooming/panning

1.1.0

• Support for mouse/pointer events on geometries (by @perliedman)
• Support for point symbolizers as basic CircleMarkers (by @perliedman)

1.0.1

• Updated dependencies, notably Leaflet 1.0.1.
• Updated build script so Windows users don't hit a 20-year-old legacy filesystem bug (by @LuSilf)

1.0.0

• Switch to web workers for most of the heavy lifting (geojson-vt, topojson).

0.1.2

• Do not throw errors when trying (and failing) to render points

0.1.0

• TopoJSON support

0.0.0

• Initial, supprt-buggy release