UX: update 'distance' indicator faster while dragging the map

This commit is contained in:
Pieter Vander Vennet 2025-08-19 17:21:43 +02:00
parent 4a63ca8cb6
commit d8f7fe3b01
2 changed files with 25 additions and 0 deletions

View file

@ -50,6 +50,7 @@
mla.lastClickLocation.addCallbackAndRunD((lastClick) => {
dispatch("click", lastClick)
})
mla.installQuicklocation()
mapProperties.location.syncWith(value)
if (onCreated) {
onCreated(value, map, mla)

View file

@ -757,4 +757,28 @@ export class MapLibreAdaptor implements MapProperties, ExportableMap {
})
})
}
/**
* In general, the 'location'-attribute is only updated when the map stops moving.
* In some cases, we'd like to update the map faster, especially when the map is used for an input-element
* such as distance, snap-to, ...
*
* In that case, calling this method will install an extra handler on 'drag', updating the location faster.
* To avoid rendering artefacts or too frequenting pinging, this is ratelimited to one update every 'rateLimitMs' milliseconds
*/
public installQuicklocation(ratelimitMs = 50) {
this._maplibreMap.addCallbackAndRunD(map => {
let lastUpdate = new Date().getTime()
map.on("drag", e => {
let now = new Date().getTime()
if(now - lastUpdate < ratelimitMs){
return
}
lastUpdate = now;
const center = map.getCenter()
this.location.set({lon: center.lng, lat: center.lat})
})
})
}
}