maplibre-gl-terradraw & Terra Draw

Sun, 01 Sep 2024 00:00:00 +0900

Period: September 2024 – present

Links: GitHub (watergis/maplibre-gl-terradraw) · Terra Draw · Terra Draw workshops

Background

For a long time, both Mapbox and MapLibre relied on mapbox-gl-draw to provide drawing functionality. However, it is no longer actively maintained, and it has become increasingly difficult to use with MapLibre. Terra Draw is a drawing library with a unified API for most web mapping libraries (MapLibre, Mapbox, Leaflet, OpenLayers, Google Maps and ArcGIS), but integrating its full functionality into MapLibre still requires a lot of configuration.

What I built

I developed maplibre-gl-terradraw, a MapLibre plugin that adds a pre-configured drawing feature with a single line of code:

map.addControl(new MaplibreTerradrawControl())

All Terra Draw modes (point, line, polygon, rectangle, circle, freehand, etc.) with pre-configured icons
Selecting, editing and deleting features, and downloading drawn features
Customizable Terra Draw options and styles
Measure control to measure line distances and polygon areas, and to query elevation from raster DEM sources (MapLibre Terrain, TerrainRGB and Terrarium)

I also contribute to Terra Draw itself and maintain hands-on workshop materials for developers.

Talks & workshops

Tech stack

TypeScript, MapLibre GL JS, Terra Draw, Vite

JavaScript | JIN IGARASHI

maplibre-gl-terradraw & Terra Draw

Background

What I built

Talks & workshops

Tech stack