# leaflet-craft
> Zoopla inspired freehand polygon creation using Leaflet.js.
Latest version **4.1.7** (published 2020-05-11) · MIT license · 0 weekly downloads
## Install
```sh
npm install leaflet-craft
pnpm add leaflet-craft
yarn add leaflet-craft
bun add leaflet-craft
```
## Health
**Score 30/100 (F)** — status: abandoned.
Positive: has types; esm support; no vulnerabilities; high quality score.
Warnings: low downloads; large bundle.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 4.1.7 |
| Published | 2020-05-11 |
| First published | 2019-11-06 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 12 |
| Unpacked size | 11.3 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 14 |
| Author | Sagarpreet Chadha |
| Maintainers | sagarpreet |
| Keywords | leaflet, freedraw, polygon, drawing, freehand, zoopla, geospatial, search, area |
## Links
- npm: https://www.npmjs.com/package/leaflet-craft
- Repository: https://github.com/sagarpreet-chadha/Leaflet-Craft
- Issues: https://github.com/sagarpreet-chadha/Leaflet-Craft
- npm.io page: https://npm.io/package/leaflet-craft
## Dependencies (12)
- [d3-shape](https://npm.io/package/d3-shape.md) ^1.3.7
- [@turf/area](https://npm.io/package/@turf/area.md) 6.0.1
- [@turf/union](https://npm.io/package/@turf/union.md) ^5.1.5
- [concavehull](https://npm.io/package/concavehull.md) ^0.1.6
- [d3-selection](https://npm.io/package/d3-selection.md) ^1.4.1
- [turf-polygon](https://npm.io/package/turf-polygon.md) ~1.0.3
- [@turf/helpers](https://npm.io/package/@turf/helpers.md) 6.1.4
- [@turf/simplify](https://npm.io/package/@turf/simplify.md) ^5.1.5
- [turf-intersect](https://npm.io/package/turf-intersect.md) ~3.0.12
- [@turf/clean-coords](https://npm.io/package/@turf/clean-coords.md) ^6.0.1
- [@turf/unkink-polygon](https://npm.io/package/@turf/unkink-polygon.md) ^5.1.5
- [@turf/points-within-polygon](https://npm.io/package/@turf/points-within-polygon.md) 5.1.5
## Alternatives
- [jsforce](https://npm.io/package/jsforce.md) — 851.2K weekly downloads
- [react-native-qrcode-svg](https://npm.io/package/react-native-qrcode-svg.md) — 693.5K weekly downloads
- [@salesforce/plugin-data](https://npm.io/package/@salesforce/plugin-data.md) — 394.9K weekly downloads
- [@backstage/plugin-search-common](https://npm.io/package/@backstage/plugin-search-common.md) — 308.5K weekly downloads
- [@chain-registry/types](https://npm.io/package/@chain-registry/types.md) — 38.4K weekly downloads
## Recent versions
- 4.1.7 (latest) — 2020-05-11
- 4.1.6 — 2020-04-30
- 4.1.5 — 2020-04-29
- 4.0.5 — 2020-02-04
- 4.0.4 — 2020-02-04
- 4.0.3 — 2020-01-13
- 4.0.2 — 2020-01-13
- 4.0.1 — 2020-01-13
- 4.0.0 — 2020-01-09
- 3.0.1 — 2019-12-24
- 3.0.0 — 2019-12-24
- 2.0.3 — 2019-12-23
- 2.0.2 — 2019-12-23
- 2.0.1 — 2019-12-23
- 2.0.0 — 2019-12-23
- … 39 more at https://npm.io/package/leaflet-craft/versions
## README
# Leaflet-Craft
### DEMO: https://sagarpreet-chadha.github.io/Leaflet-Craft/example/index
[](https://badge.fury.io/js/leaflet-craft)
----
npm : https://www.npmjs.com/package/leaflet-craft
Extends https://github.com/Wildhoney/Leaflet.FreeDraw made by WildHoney and adds following functionalities to it:
1. Adds Undo-Redo feature to Polygons.
2. Adds Delete 1 marker feature by right clicking it.
3. Adds Delete multiple markers by drawing circle around them :)
4. Adds Control Bar to easily change MODES - Create, Edit, Delete Polygon, Delete 1 Marker, Delete multiple Markers.
5. Calculates AREA (in metre square) of polygon which changes dynamically on editing the polygon. Stored with key `polygonArea` in each polygon's leaflet object.
`export const polygonArea = Symbol('freedraw/polygonArea')`
We use TURF Area function to calculate the area.
6. Add Hooks:
We can subscribe to following Event listeners and can pass a callback function to be executed. Callback function can be asynchronous as well, also the return value should be **TRUE** to continue the event (create/edit/delete) else if your callback function returns **False** then that event is forfeited.
This is implemented by ES6 promise.
* Polygon created: Started
* Polygon created: Ended
* Polygon edit: Started
* Polygon edit: Ended
* Polygon delete: Started
* Polygon delete: Ended
Work in PROGRESS:
1. Conversion to Typescript.
2. Adding functionality to create Polygon via clicking (similar to Leaflet.Draw).
3. Extending React-Leaflet to support React apps.
## ABOUT:
Thank you @wildhoney, @ankeetmaini and other contributors :heart: . This library is actively maintained by @sagarpreet-chadha .
---
_Source: https://npm.io/package/leaflet-craft · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._