How to use leaflet-geomanplugin with react-leaflet?

63 views Asked by At

I tried implementing a rotate functionality on my Rectangle elements and stumpbled across leaflet-geoman which works pretty well.

const rect = (
      <Rectangle
        key={layer.id}
        bounds={bounds}
        eventHandlers={{
          click: () => {
           handleLayerClicked(object);
          },
          'pm:rotateend'...
        }}
      >
      </Rectangle>
    );
    layersJSX.push(rect);
  });

  return layersJSX;

This works fine. Even passing the event handlers like pm:update or pm:rotateend works on the component.

I cant seem to figure out how to apply a rotation on the Rectangle itself in my case? When working with plain JS like:

const rect = L.rectangle(bounds, {
      stroke: layer.isHighlighted,
      color: getColorForSelectedLayer(layer.id ?? ''),
    }).addTo(map);
rect.pm.rotateLayerToAngle(angle);

it works.

Any input is highly appreciated since I would like to use the components from react-leaflet along with leaflet-geoman.

0

There are 0 answers