@watergis/maplibre-gl-terradraw 0.0.2 → 0.0.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +24 -6
- package/dist/maplibre-gl-terradraw.es.js +287 -239
- package/dist/maplibre-gl-terradraw.es.js.map +1 -1
- package/dist/maplibre-gl-terradraw.umd.js +1 -1
- package/dist/maplibre-gl-terradraw.umd.js.map +1 -1
- package/dist/types/MaplibreTerradrawControl.d.ts.map +1 -1
- package/dist/types/constants/AvailableModes.d.ts +1 -1
- package/dist/types/constants/AvailableModes.d.ts.map +1 -1
- package/dist/types/helpers/getTerraDrawModes.d.ts.map +1 -1
- package/package.json +38 -23
package/README.md
CHANGED
|
@@ -5,15 +5,19 @@
|
|
|
5
5
|
[](https://github.com/watergis/maplibre-gl-terradraw/actions/workflows/ci.yml)
|
|
6
6
|
[](https://app.netlify.com/sites/maplibre-gl-terradraw/deploys)
|
|
7
7
|
|
|
8
|
-
This plugin is to add controls to your
|
|
8
|
+
This plugin is to add controls to your MapLibre for sketching powered by [Terra Draw](https://github.com/JamesLMilner/terra-draw) library.
|
|
9
9
|
|
|
10
|
-
##
|
|
10
|
+
## Usage
|
|
11
|
+
|
|
12
|
+
### NPM
|
|
13
|
+
|
|
14
|
+
- install
|
|
11
15
|
|
|
12
16
|
```shell
|
|
13
17
|
npm i -D @watergis/maplibre-gl-terradraw
|
|
14
18
|
```
|
|
15
19
|
|
|
16
|
-
|
|
20
|
+
Then,
|
|
17
21
|
|
|
18
22
|
```ts
|
|
19
23
|
import { MaplibreTerradrawControl } from '@watergis/maplibre-gl-terradraw';
|
|
@@ -34,16 +38,16 @@ map.addControl(
|
|
|
34
38
|
);
|
|
35
39
|
```
|
|
36
40
|
|
|
37
|
-
As default, all
|
|
41
|
+
As default, all Terra Draw modes are enabled, you can disable options if you don't want to use them.
|
|
38
42
|
|
|
39
|
-
You can get
|
|
43
|
+
You can get Terra Draw instance by the following function.
|
|
40
44
|
|
|
41
45
|
```ts
|
|
42
46
|
const drawControl = new MaplibreTerradrawControl();
|
|
43
47
|
const drawInstance = drawControl.getTerraDrawInstance();
|
|
44
48
|
```
|
|
45
49
|
|
|
46
|
-
You can add event listener to subscribe
|
|
50
|
+
You can add event listener to subscribe Terra Draw event as you wish. The below example is to subscribe `select` event of Terra Draw.
|
|
47
51
|
|
|
48
52
|
```ts
|
|
49
53
|
drawInstance.on('select', (id: string) => {
|
|
@@ -53,6 +57,20 @@ drawInstance.on('select', (id: string) => {
|
|
|
53
57
|
});
|
|
54
58
|
```
|
|
55
59
|
|
|
60
|
+
### CDN
|
|
61
|
+
|
|
62
|
+
Include CSS and umd.js from CDN as follows.
|
|
63
|
+
|
|
64
|
+
```html
|
|
65
|
+
<script src="https://cdn.jsdelivr.net/npm/@watergis/maplibre-gl-terradraw@latest/dist/maplibre-gl-terradraw.umd.js"></script>
|
|
66
|
+
<link
|
|
67
|
+
rel="stylesheet"
|
|
68
|
+
href="https://cdn.jsdelivr.net/npm/@watergis/maplibre-gl-terradraw@latest/dist/maplibre-gl-terradraw.css"
|
|
69
|
+
/>
|
|
70
|
+
```
|
|
71
|
+
|
|
72
|
+
For CDN example, please refer to [index_cdn.html](./static/index_cdn.html).
|
|
73
|
+
|
|
56
74
|
## Contribution
|
|
57
75
|
|
|
58
76
|
See [CONTRIBUTING](./CONTRIBUTING.md)
|