Skip to content
This repository has been archived by the owner on Nov 26, 2020. It is now read-only.

Refactor/opt in to use type build #1

Open
wants to merge 3 commits into
base: develop
Choose a base branch
from
Open

Refactor/opt in to use type build #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6ba04f4
refactor: remove pmIgnore and optIn and replace it with useType
limfinity Oct 15, 2019
0d293a9
chore: remove logs
limfinity Oct 16, 2019
2a2e151
make dist available for delivering
limfinity Oct 17, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,8 @@ npm-debug.log
/node_modules/
/bower_components/
/.idea/
/dist/
\.source*
/cypress/screenshots
/cypress/videos
/cypress/videos

# /dist/
51 changes: 29 additions & 22 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,6 @@
- [Customization](#customize)
- [Need a feature?](#feature-request) | [Existing Feature Requests](https://github.com/geoman-io/leaflet-geoman/issues?q=is%3Aissue+is%3Aclosed+label%3A%22feature+request%22+sort%3Areactions-%2B1-desc)


### Installation

#### Migrate from Leaflet.PM
Expand All @@ -51,6 +50,7 @@
npm uninstall leaflet.pm
npm i @geoman-io/leaflet-geoman-free
```

That's it.

#### Install via npm
Expand Down Expand Up @@ -93,8 +93,13 @@ import '@geoman-io/leaflet-geoman-free/dist/leaflet-geoman.css';

#### Init leaflet-geoman

Just include `leaflet-geoman.min.js` right after Leaflet. It initializes itself. If
you want certain layers to be ignored by leaflet-geoman, pass `pmIgnore: true` to
Just include `leaflet-geoman.min.js` right after Leaflet and initialize it with:

```js
L.PM.initialize();
```

If you want certain layers to be ignored by leaflet-geoman, pass `pmIgnore: true` to
their options when creating them. Example:

```js
Expand All @@ -115,7 +120,6 @@ All layers will be ignored by leaflet-geoman, unless you specify `pmIgnore: fals
L.marker([51.50915, -0.096112], { pmIgnore: false }).addTo(map);
```


#### leaflet-geoman Toolbar

<img align="left" height="200" src="https://file-ffrjxxowri.now.sh/" alt="leaflet-geoman Toolbar">
Expand All @@ -132,19 +136,19 @@ map.pm.addControls({

See the available options in the table below.

| Option | Default | Description |
| :------------ | :---------- | :----------------------------------------------------------------------------------------------- |
| position | `'topleft'` | toolbar position, possible values are `'topleft'`, `'topright'`, `'bottomleft'`, `'bottomright'` |
| drawMarker | `true` | adds button to draw markers |
| drawCircleMarker | `true` | adds button to draw circle markers |
| drawPolyline | `true` | adds button to draw rectangle |
| drawRectangle | `true` | adds button to draw rectangle |
| drawPolygon | `true` | adds button to draw polygon |
| drawCircle | `true` | adds button to draw circle |
| editMode | `true` | adds button to toggle edit mode for all layers |
| dragMode | `true` | adds button to toggle drag mode for all layers |
| cutPolygon | `true` | adds button to cut a hole in a polygon |
| removalMode | `true` | adds a button to remove layers |
| Option | Default | Description |
| :--------------- | :---------- | :----------------------------------------------------------------------------------------------- |
| position | `'topleft'` | toolbar position, possible values are `'topleft'`, `'topright'`, `'bottomleft'`, `'bottomright'` |
| drawMarker | `true` | adds button to draw markers |
| drawCircleMarker | `true` | adds button to draw circle markers |
| drawPolyline | `true` | adds button to draw rectangle |
| drawRectangle | `true` | adds button to draw rectangle |
| drawPolygon | `true` | adds button to draw polygon |
| drawCircle | `true` | adds button to draw circle |
| editMode | `true` | adds button to toggle edit mode for all layers |
| dragMode | `true` | adds button to toggle drag mode for all layers |
| cutPolygon | `true` | adds button to cut a hole in a polygon |
| removalMode | `true` | adds a button to remove layers |

If you are wondering how e.g. the `drawPolygon` button will enable drawing mode
with specific options, here it is: Simply enable drawing mode programatically,
Expand Down Expand Up @@ -240,14 +244,14 @@ Here's a list of layer events you can listen to:
| pm:centerplaced | `e` | Called when the center of a circle is placed/moved. |

For making the snapping to other layers selective, you can add the "snapIgnore" option to your layers to disable the snapping to them during drawing.

```js
L.geoJSON(data,{
snapIgnore : true
})
L.geoJSON(data, {
snapIgnore: true,
});
//This layer will be ignored by the snapping engine during drawing
```


### Edit Mode

Let's you edit vertices of layers. Use it like this:
Expand Down Expand Up @@ -324,6 +328,7 @@ map.on('pm:globaleditmodetoggled', e => {
console.log(e);
});
```

The event has an object with an enabled boolean and a reference to the map.

### Drag Mode
Expand Down Expand Up @@ -355,6 +360,7 @@ map.on('pm:globaldrawmodetoggled', e => {
console.log(e);
});
```

The event has an object with an enabled boolean and a reference to the map.

### Removal Mode
Expand Down Expand Up @@ -385,6 +391,7 @@ map.on('pm:globalremovalmodetoggled', e => {
console.log(e);
});
```

The event has an object with an enabled boolean and a reference to the map.

### Cutting Mode
Expand Down Expand Up @@ -526,4 +533,4 @@ I also took a hard look at the great
[L.GeometryUtil](https://github.com/makinacorpus/Leaflet.GeometryUtil) for some
of my helper functions.

If you want to support the development of leaflet-geoman, consider subscribing to the services of [Geoman](https://geoman.io).
If you want to support the development of leaflet-geoman, consider subscribing to the services of [Geoman](https://geoman.io).
Loading