How to control center & zoom dynamically?

[flosse]

Both, center and zoom aren't declared as Signal:

https://github.com/headless-studio/leptos-leaflet/blob/d65f9a1645199ca8f7cfe43e2debf1858e8fbe8b/leptos-leaflet/src/components/map_container.rs#L18-L21

Does this mean, I have to re-render the MapContainer component on every change of the center or zoom property?

[flosse]

... or how can I access the underlying Map to execute functions like Map::fly_to_with_options?

[flosse]

Ok, at least I found a workaround now:

   Effect::new(move|_|{
        let map_context = use_leaflet_context();
        let pos = center.get();
        let Some(map) = map_context.and_then(|cx|cx.map()) else {
          log::warn!("No leaflet map found");
          return;
        };
        let lat_lng = leaflet::LatLng::new(pos.lat, pos.lng);
        log::debug!("Fly to {lat_lng:?} @ {zoom}");
        map.fly_to(&lat_lng, zoom);
    });

But maybe there is a more elegant solution?

Otherwise I'd suggest to

• rename the center property to initial_center
• provide a center: MaybeSignal<Position> property
• create an effect similar as described above if the center property was set.

If that's the case, I could create a PR.

[dgsantana]

Sorry for the delay. You can access the underlying map object, and then call any exposed leaflet function, if you pass a write signal to the map property of the container, and you can also register for events using the events property. The events include, zoom and move events of leaflet.

<MapContainer map=tour_state.map.write_only() events=events>...</MapContainer>

[flosse]

Sorry for the delay.

No problem! I'm sorry for my flood of comments :see_no_evil:

You can access the underlying map object, and then call any exposed leaflet function, if you pass a write signal to the map property of the container

nice, that's feels much better than use_leaflet_context :+1: :smile: