🧩 LRotatedMarker

Leaflet plugin to enable the rotation of map marker icons

🧪 Demo

<script setup lang="ts">
import { LMap, LTileLayer } from '@maxel01/vue-leaflet'
import { LRotatedMarker } from '@maxel01/vue-leaflet-plugins'
</script>

<template>
    <LMap :zoom="9" :center="[47.41322, -1.219482]">
        <LTileLayer
            url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
            layer-type="base"
            name="OpenStreetMap"
        />
        <LRotatedMarker
            :latLng="[47.41322, -1.219482]"
            :rotation-angle="45"
            draggable
        />
    </LMap>
</template>

⚙️ Props

Prop name	Description	Type	Reactive	Default	Required
rotationAngle	The rotation angle	number	true	-	false
rotationOrigin	The rotation origin	PointExpression | string	true	-	false

🔗 Inherited props

from MarkerProps

Prop name	Description	Type	Reactive	Default	Required
draggable	Whether the marker is draggable with mouse/touch or not.	boolean	true	-	false
icon	Icon instance to use for rendering the marker. See Icon documentation for details on how to customize the marker icon. If not specified, a common instance of Icon.Default is used.	IconOptions>	true	-	false
zIndexOffset	By default, marker images zIndex is set automatically based on its latitude. Use this option if you want to put the marker on top of all others (or below), specifying a high value like 1000 (or high negative value, respectively).	number	true	-	false
latLng	The position of the marker	LatLngExpression	true	-	true

from LayerProps

Prop name	Description	Type	Reactive	Default	Required
pane	By default, the layer will be added to the map's overlay pane. Overriding this option will cause the layer to be placed on another pane by default. Not effective if the renderer option is set (the renderer option will override the pane option).	string	initOnly	-	false
attribution	String to be shown in the attribution control, e.g. "© OpenStreetMap contributors". It describes the layer data and is often a legal obligation towards copyright holders and tile providers.	string	true	-	false
name	-	string	true	-	false
layerType	-	LayerType	true	-	false
visible	-	boolean	true	-	false

from ComponentProps

Prop name	Description	Type	Reactive	Default	Required
options	Leaflet options to pass to the component constructor.	T	initOnly	-	false

🎯 Slots

Name	Description
default	Used to inject Leaflet child components like <LPopup> or <LTooltip> into the LDonut.

🧭 Exposes

Name	Type	Description
ready	Ref<boolean>	Indicates whether the component and its underlying Leaflet object are fully initialized.
leafletObject	Ref<Hotline | undefined>	The underlying Leaflet instance. Can be used to directly interact with the Leaflet API (e.g. calling methods or accessing internal state).