leptos_leaflet/components/
image_overlay.rs

1use leptos::logging::log;
2use leptos::prelude::*;
3use super::{Bounds, LeafletMapContext};
4use crate::core::IntoThreadSafeJsValue;
5
6
7/// An image overlay component.
8#[component(transparent)]
9pub fn ImageOverlay(
10    #[prop(into)] url: String,
11    #[prop(into)] bounds: Bounds,
12    #[prop(into, optional)] opacity: Option<Signal<f64>>,
13    #[prop(into, optional)] alt: Option<Signal<String>>,
14    #[prop(into, optional)] interactive: Option<Signal<bool>>,
15    #[prop(into, optional)] cross_origin: Option<Signal<String>>,
16    #[prop(into, optional)] cross_origin_toggle: Option<Signal<bool>>,
17    #[prop(into, optional)] error_overlay_url: Option<Signal<String>>,
18    #[prop(into, optional)] z_index: Option<Signal<f64>>,
19    #[prop(into, optional)] class_name: Option<Signal<String>>,
20    #[prop(into, optional)] bubbling_mouse_events: Option<Signal<bool>>,
21    #[prop(into, optional)] pane: Option<Signal<String>>,
22    #[prop(into, optional)] attribution: Option<Signal<String>>,
23) -> impl IntoView {
24    let map_context = use_context::<LeafletMapContext>().expect("map context not found");
25    Effect::new(move |_| {
26        if let Some(map) = map_context.map() {
27            log!("Adding image layer: {}", url);
28            let options = leaflet::ImageOverlayOptions::new();
29            if let Some(opacity) = opacity {
30                options.set_opacity(opacity.get_untracked());
31            }
32            if let Some(alt) = &alt {
33                options.set_alt(alt.get_untracked());
34            }
35            if let Some(interactive) = interactive {
36                options.set_interactive(interactive.get_untracked());
37            }
38            if let Some(cross_origin) = &cross_origin {
39                options.set_cross_origin(cross_origin.get_untracked());
40            }
41            if let Some(cross_origin_toggle) = cross_origin_toggle {
42                options.set_cross_origin_toggle(cross_origin_toggle.get_untracked());
43            }
44            if let Some(error_overlay_url) = &error_overlay_url {
45                options.set_error_overlay_url(error_overlay_url.get_untracked());
46            }
47            if let Some(z_index) = z_index {
48                options.set_z_index(z_index.get_untracked());
49            }
50            if let Some(class_name) = &class_name {
51                options.set_class_name(class_name.get_untracked());
52            }
53            if let Some(bubbling_mouse_events) = bubbling_mouse_events {
54                options.set_bubbling_mouse_events(bubbling_mouse_events.get_untracked());
55            }
56            if let Some(pane) = &pane {
57                options.set_pane(pane.get_untracked());
58            }
59            if let Some(attribution) = &attribution {
60                options.set_attribution(attribution.get_untracked());
61            }
62
63            let map_layer = leaflet::ImageOverlay::new_with_options(&url, &bounds.as_lat_lng_bounds(), &options)
64                .into_thread_safe_js_value();
65            map_layer.add_to(&map);
66            on_cleanup(move || {
67                map_layer.remove();
68            });
69        }
70    });
71}
leptos_leaflet/components/image_overlay.rs

leptos_leaflet/components/
image_overlay.rs
