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.