Closed dabreegster closed 9 months ago
The approach you've suggested here is similar to what I've done in other projects at work (using Leaflet, which doesn't have native support for this, but basically the same idea).
If this can actually be made to work well with MapLibre's internal hash functionality that would be great, but I also have a feeling that it would end up working better to just reimplement it inside the Svelte code.
Off the top of my head, something like this might work well:
hash
property to MapLibre.svelte. Don't pass it through to the MapLibre JS library though.moveend
event handler, update the hash in the same place that currently updates center
, zoom
, and bounds
.I should be able to play with this later this week if you don't get to it first. Thanks for the suggestion!
When constructing the map,
hash
syncs the viewport to the URL. We could add this toMapLibre.svelte
. But thecenter
andzoom
in maplibre's constructor override the initial URL state. So I usually set these two params, unlesswindow.location.hash
is defined. I'm not sure howhash
in the component should work, because it looks like you're reacting to any changes to thezoom
andcenter
props: https://github.com/dimfeld/svelte-maplibre/blob/ad6bb3eafaccfa53ca13e3e099c8743383da9f7b/src/lib/MapLibre.svelte#L162Maybe maplibre's own
hash
functionality should be ignored, and if this prop is set, something in the component could instead keep the URL fragment synced up?