dimfeld / svelte-maplibre

Svelte bindings for the MapLibre mapping library
https://svelte-maplibre.vercel.app
MIT License
283 stars 34 forks source link

Combine zoom and center handling into a single call to map.easeTo #168

Closed dimfeld closed 1 month ago

dimfeld commented 1 month ago

Maybe I'm wrong but it seems like the current behaviour

$: if (center && !compare(center, $mapInstance?.getCenter())) $mapInstance?.panTo(center);
$: if (zoom && !compare(zoom, $mapInstance?.getZoom())) $mapInstance?.zoomTo(zoom);

does not allow changing both zoom and map center together. Maplibre will zoom properly, fire a moveend event, and forget about finishing panning to the center.

e.g. clicking the button below will zoom but panning won't be performed properly

//...
  let c = [-9.142685, 38.736946];
  let z = 2;
</script>

<button on:click={() => {
    c = [-3.13, 17.73];
    z = 6;
}}>Jump somewhere else</button>
<MapLibre
  style="https://basemaps.cartocdn.com/gl/positron-gl-style/style.json"
  center={c}
  zoom={z}
//...

Originally posted by @timadevelop in https://github.com/dimfeld/svelte-maplibre/issues/149#issuecomment-2115813071