I built an open-source React map drawing library because I got tired of fighting drawing controls that wanted to own the UI.
react-map-annotate lets your application control the drawing session. Put the toolbar in your sidebar, header, or command palette. Select tools, finish shapes, edit labels and colors, undo/redo, and persist annotations through React state.
It supports Mapbox, MapLibre, Google Maps, Leaflet, and ArcGIS through separate adapters, with a shared annotation model.
The goal is simple: the map should render the drawing, not dictate how your application works.
It includes freehand drawing, polygons, rectangles, circles, arrows, markers, text, and measurement tools, along with editing handles and a headless API.
The project is MIT licensed and available on npm. I’d love feedback from developers building GIS, field-service, site-planning, or other map-heavy applications—especially anyone who has had to work around existing drawing controls.
GitHub: https://github.com/orange-groove/react-map-annotate
npm: https://www.npmjs.com/package/@orange-groove/react-map-annotate
What would you need from a drawing library before using it in a production application?
Top comments (0)