🧑💻 Usage
Vue Leaflet Plugins is a module that provides a set of components to extend Vue Leaflet with Leaflet v2 plugins in Vue 3.
Here is a basic example of how to use the LMap
and LTileLayer
components along with a plugin component from Leaflet.hotline
to display a map:
vue
<script setup lang="ts">
import { LMap, LTileLayer } from '@maxel01/vue-leaflet'
import { LHotline } from '@maxel01/vue-leaflet-plugins'
</script>
<template>
<LMap :zoom="9" :center="[47.31322, -1.319482]">
<LTileLayer
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
layer-type="base"
name="OpenStreetMap"
/>
<LHotline
:lat-lngs="[
[47.334852, -1.509485, 150],
[47.342596, -1.328731, 250],
[47.241487, -1.190568, 350],
[47.234787, -1.358337, 250]
]"
:min="150"
:max="350"
/>
</LMap>
</template>
And here is how it should look :