Overview

Provides a suite of editable deck.gl layers, primarly focused on GeoJSON visualization and editing.

caution

The deck.gl-community repository is semi-maintaned. One of its goals is to collect and preserve valuable deck.gl ecosystem related code that does not have a dedicated home. Some modules may no longer have dedicated maintainers. This means that there is sometimes no one who can respond quickly to issues.

Design Goals

@deck.gl-community/editable-layers aspires to be an ultra-performant, fully 3D-enabled GeoJSON editing system primarily focused on geospatial editing use cases.

• Maximal rendering and editing performance.
• Editing at 60fps (e.g. dragging sub objects) in GeoJSON payloads with 100K features (points, lines or polygons).
• Handle GeoJSON corner cases (e.g. automatically changing object types from Polygon to MultiPolygon when addition polygons are added).
• Fully 3D enabled (Can use WebGL z-buffer so that lines being rendered are properly occluded by other geometry).
• Seamless integration with deck.gl, allowing for GeoJSON editing to be interleaved with rich 3D visualizations.
• Handle event handling, including touch screen support.

History

This module is a fork of / successor to nebula.gl. nebula.gl was a popular and important part of the deck.gl ecosystem but the repository has lacked maintainers for several years and the repository no longer accepts external contributions.

Upgrade Guide

Upgrade to editable-layers v9.1

• Changes
  • Make sure your deck.gl and luma.gl dependencies are updated to v9.1
• Deprecations:
  • properties.shape is deprecated, use properties.editProperties.shape.

Upgrading from nebula.gl to editable-layers v9.0

The main effort should be to replace your dependencies in package.json and replace import statements in your code:

nebula.gl import	deck.gl-community import	Comment
nebula.gl	=> @deck.gl-community/editable-layers
import '@nebula.gl/edit-modes'	=> @deck.gl-community/editable-layers
import '@nebula.gl/layers	=> @deck.gl-community/editable-layers
import '@nebula.gl/overlays	=> @deck.gl-community/react
import '@nebula.gl/editor'	=> N/A	Copy code from examples/editor directory into your app
import 'react-map-gl-draw'	=> N/A	Copy code from nebula.gl repo into your app.

• react-map-gl-draw
  • nebula.gl's react-map-gl-draw module was not ported to deck.gl-community.
  • The main reason why a user would want to update react-map-gl-draw is likely to make it work with a newer React version.
  • react-map-gl-draw is a small module in nebula.gl and you could probably just copy the source code into your app and bump the react dependency.

What's New

editable-layers v9.3

• EditModeTrayWidget — New deck.gl widget providing a mode selection tray UI, eliminating the need for custom React toolbars.
• All examples modernized — Every example now uses Vite, TypeScript, React 19 with functional components and hooks.
• New examples — getting-started (minimal setup), no-map (editing without a basemap using BitmapLayer background).
• Deprecated MeshLayer docs removed — MeshLayer was never part of editable-layers; use @deck.gl/mesh-layers directly.
• Overlays example moved to @deck.gl-community/widgets where it belongs.
• DrawPolygonMode — Improved hole drawing with validation, max hole limits, and emitInvalidEvents for error feedback.

editable-layers v9.1

• Now stores properties of created circles and ellipses in properties.editProperties.

editable-layers v9.0

• The code has been updated to work with deck.gl v9.
• The module structure has been simplified via the module mapping in the table below.

@deck.gl-community/editable-layers module	Description	deck.gl-community module
nebula.gl	The core module	=> @deck.gl-community/editable-layers
@nebula.gl/edit-modes	Optional edit modes	=> @deck.gl-community/editable-layers
@nebula.gl/layers	The actual layers	=> @deck.gl-community/editable-layers
@nebula.gl/overlays	React overlays	=> @deck.gl-community/react
@nebula.gl/editor	React wrappers	=> Code moved into "editor" example
react-map-gl-draw	Non-deck-wrapper	=> NOT FORKED