Crate dioxus_leaflet 

Dioxus Leaflet

A general-purpose Leaflet map component for Dioxus applications.

Features

• Easy-to-use map component with customizable markers
• Support for popups and custom styling
• Extensible marker system
• TypeScript-like props system
• Flexible Leaflet integration: CDN (with version selection) or local files
• Configurable Leaflet resources with integrity checking

Basic Usage

use dioxus::prelude::*;
use dioxus_leaflet::{LatLng, Map, MapPosition, Marker, Popup};
 
fn App() -> Element {
    rsx! {
        Map {
            initial_position: MapPosition::new(51.505, -0.09, 13.0),
            height: "400px",
            width: "100%",
            Marker {
                coordinate: LatLng::new(51.505, -0.09),
                Popup {
                    b { "London" }
                    br { }
                    "Capital of England"
                }
            }
        }
    }
}

Advanced Configuration

Using a specific Leaflet version from CDN

use dioxus::prelude::*;
use dioxus_leaflet::{Map, MapPosition, MapOptions, LeafletResources};
 
fn App() -> Element {
    let options = MapOptions::default()
        .with_leaflet_resources(LeafletResources::cdn("1.9.3"));
 
    rsx! {
        Map {
            initial_position: MapPosition::default(),
            options: options,
            height: "400px",
            width: "100%"
        }
    }
}

Using local Leaflet files

use dioxus::prelude::*;
use dioxus_leaflet::{Map, MapPosition, MapOptions, LeafletResources};
 
fn App() -> Element {
    let options = MapOptions::default()
        .with_leaflet_resources(LeafletResources::local(
            "/static/css/leaflet.css",
            "/static/js/leaflet.js"
        ));
 
    rsx! {
        Map {
            initial_position: MapPosition::default(),
            options: options,
            height: "400px",
            width: "100%"
        }
    }
}

Re-exports

pub use components::Map;

pub use components::Map;

pub use components::Marker;

pub use components::Marker;

pub use components::Polygon;

pub use components::Polygon;

pub use components::Popup;

pub use components::Popup;

Structs

LatLng

MapOptions

Map configuration options

MapPosition

Represents a geographical position with zoom level

MarkerIcon

Custom marker icon configuration

PathOptions

PopupOptions

Popup configuration options

TileLayer

Tile layer configuration

Enums

LeafletResources

Leaflet resource configuration

LineCap

LineJoin

Functions

Map

Main map component using Leaflet

Marker

Props

Polygon

Props

Popup

Props

Type Aliases

Color