GeoJsonLayer

Specifies the styling for GeoJSON features. These styles can be overridden with overrideStyles.

const geoJsonData = {
  type: 'Feature',
  id: 'EiffelTower_linestring',
  properties: {
    color: 'rgba(0,0,255,0.7)',    // custom color
    width: 10,                     // custom line width
  },
  geometry: {
    type: 'LineString',
    coordinates: [
      [2.2955, 48.8594],
      [2.2935, 48.8594],
    ],
  },
};

The data describing the geometric object in GeoJSON format. Accepts a single GeoJSON object or an array of GeoJSON feature objects.

const geoJsonData = {
  type: 'Feature',
  id: 'EiffelTower_polygon',
  properties: {
    color: 'rgba(0,255,0,0.3)',
  },
  geometry: {
    type: 'Polygon',       // the polygon is a rectangle around the Eiffel Tower
    coordinates: [
      [
        [2.2935, 48.8574], // bottom-left
        [2.2955, 48.8574], // bottom-right
        [2.2955, 48.8594], // top-right
        [2.2935, 48.8594], // top-left
      ],
    ],
  },
};

The options to set on this layer.

 const geoJsonOptions = {
   filled: false,
   units: 'pixels'
 };

// ...

 return (
   <MapWeave>
   <GeoJsonLayer data={geoJsonData} options={geoJsonOptions} />
   </MapWeave>
 );

Defines the style properties to override for the specified GeoJSON features.