orbit-map-tools

EditableGeoJsonLayer

EditableGeoJsonLayer is implemented as a deck.gl layer. It provides the ability to view and edit multiple types of geometry formatted as GeoJSON (an open standard format for geometry) including polygons, lines, and points.

import DeckGL from "@deck.gl/react";
import { EditableGeoJsonLayer, DrawPolygonMode } from "nebula.gl";

const myFeatureCollection = {
  type: "FeatureCollection",
  features: [
    /* insert features here */
  ]
};

const selectedFeatureIndexes = [];

class App extends React.Component {
  state = {
    data: myFeatureCollection
  };

  render() {
    const layer = new EditableGeoJsonLayer({
      id: "geojson-layer",
      data: this.state.data,
      mode: DrawPolygonMode,
      selectedFeatureIndexes,

      onEdit: ({ updatedData }) => {
        this.setState({
          data: updatedData
        });
      }
    });

    return <DeckGL {...this.props.viewport} layers={[layer]} />;
  }
}

Useful examples (Codesandbox)

• Hello World (using deck.gl)
• With Toolbox
• No React
• Custom EditMode