Add map action for map click

This commit is contained in:
Andrew Kingston 2022-03-15 13:25:41 +00:00
parent d89b12c57d
commit fcb3ce4da3
2 changed files with 39 additions and 6 deletions

View File

@ -2566,6 +2566,21 @@
}
]
},
{
"type": "event",
"label": "On map click",
"key": "onMapClick",
"context": [
{
"label": "Clicked latitude",
"key": "lat"
},
{
"label": "Clicked longitude",
"key": "lng"
}
]
},
{
"type": "boolean",
"label": "Enable Fullscreen",

View File

@ -25,6 +25,7 @@
export let tileURL = "https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
export let mapAttribution
export let onMarkerClick
export let onMapClick
const { styleable, notificationStore } = getContext("sdk")
const component = getContext("component")
@ -65,6 +66,14 @@
paddingTopLeft: [0, 24],
})
}
$: mapInstance?.on("click", e => {
if (onMapClick) {
onMapClick({
lat: e.latlng.lat,
lng: e.latlng.lng,
})
}
})
const updateMapDimensions = mapInstance => {
if (typeof mapInstance !== "object") {
@ -197,7 +206,14 @@
maxZoomLevel,
}
const addMapMarkers = (mapInstance, rows, latKey, lngKey, titleKey, onClick) => {
const addMapMarkers = (
mapInstance,
rows,
latKey,
lngKey,
titleKey,
onClick
) => {
if (typeof mapInstance !== "object" || !rows || !latKey || !lngKey) {
return
}
@ -218,15 +234,17 @@
row[titleKey]
)
marker.bindTooltip(markerContent, {
direction: "top",
offset: [0, -25]
}).addTo(mapMarkerGroup)
marker
.bindTooltip(markerContent, {
direction: "top",
offset: [0, -25],
})
.addTo(mapMarkerGroup)
if (onClick) {
marker.on("click", () => {
onClick({
marker: row
marker: row,
})
})
}