@mapka/maplibre-gl-sdk 0.16.4 → 0.17.0
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 +29 -2
- package/lib/.buildInfo.json +1 -1
- package/lib/index.d.ts +1 -0
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +1 -0
- package/lib/modules/icons.d.ts +8 -4
- package/lib/modules/icons.d.ts.map +1 -1
- package/lib/modules/icons.js +69 -31
- package/lib/modules/markers.d.ts.map +1 -1
- package/lib/modules/markers.js +55 -2
- package/lib/styles.css +1 -1
- package/lib/types/marker.d.ts +4 -2
- package/lib/types/marker.d.ts.map +1 -1
- package/package.json +3 -2
- package/src/components/PopupContent.css +5 -5
- package/src/index.ts +2 -0
- package/src/modules/icons.ts +74 -38
- package/src/modules/markers.css +18 -0
- package/src/modules/markers.ts +67 -3
- package/src/styles.css +1 -0
- package/src/types/marker.ts +4 -2
package/README.md
CHANGED
|
@@ -45,6 +45,33 @@ map.addMarkers([
|
|
|
45
45
|
]);
|
|
46
46
|
```
|
|
47
47
|
|
|
48
|
+
### Markers with Icons
|
|
49
|
+
|
|
50
|
+
Render a marker with a Mapka icon instead of the default pin. Supported icon sets are `maki:` and `temaki:`.
|
|
51
|
+
|
|
52
|
+
```ts
|
|
53
|
+
map.addMarkers([
|
|
54
|
+
{
|
|
55
|
+
id: 'restaurant',
|
|
56
|
+
lngLat: [18, 54],
|
|
57
|
+
icon: 'maki:restaurant',
|
|
58
|
+
color: '#ff6b35',
|
|
59
|
+
},
|
|
60
|
+
{
|
|
61
|
+
id: 'park',
|
|
62
|
+
lngLat: [18.01, 54.01],
|
|
63
|
+
icon: 'temaki:park_alt1',
|
|
64
|
+
color: '#2e7d32',
|
|
65
|
+
},
|
|
66
|
+
]);
|
|
67
|
+
```
|
|
68
|
+
|
|
69
|
+
Icons are fetched from the Mapka API, batched across markers, and cached — reusing the same `icon` id across markers performs a single request.
|
|
70
|
+
|
|
71
|
+
### Recoloring markers
|
|
72
|
+
|
|
73
|
+
`color` accepts any CSS color value and sets the SVG fill — the droplet on the default pin, every shape on a fetched icon. Attributes explicitly set to `"none"` in the source SVG are preserved, so outline-only shapes keep their transparency.
|
|
74
|
+
|
|
48
75
|
### Markers with Popups
|
|
49
76
|
|
|
50
77
|
```ts
|
|
@@ -96,8 +123,8 @@ Markers also support all standard maplibre-gl [marker options](https://maplibre.
|
|
|
96
123
|
|--------|------|-------------|
|
|
97
124
|
| `id` | `string` | Unique identifier for the marker |
|
|
98
125
|
| `lngLat` | `[number, number]` | Marker position as `[longitude, latitude]` |
|
|
99
|
-
| `
|
|
100
|
-
| `
|
|
126
|
+
| `icon` | `string` | Mapka icon id (`maki:*` or `temaki:*`). Omit to use the default pin. |
|
|
127
|
+
| `color` | `string` | CSS color applied to the SVG fill. Defaults to `#3FB1CE` for the default pin. |
|
|
101
128
|
| `popup` | `MapkaMarkerPopupOptions` | Popup configuration (see Popup Options) |
|
|
102
129
|
|
|
103
130
|
## Popups
|