Added more options to leaflet map instance
This commit is contained in:
@@ -62,7 +62,7 @@ const premiumParkingsSpots = computed(() => {
|
||||
return premiumParkings.value.reduce((acc, val) => acc + val.nb_total_place, 0)
|
||||
})
|
||||
|
||||
const { zoom, minZoom, center, maxClusterRadius, disableClusteringAtZoom } = useMap()
|
||||
const { zoom, minZoom, center, maxBounds, maxBoundsViscosity, maxClusterRadius, disableClusteringAtZoom, extraOptions } = useMap()
|
||||
const { filterUncovered, filterCovered, filterKorrigo } = storeToRefs(useMap())
|
||||
</script>
|
||||
|
||||
@@ -77,8 +77,8 @@ const { filterUncovered, filterCovered, filterKorrigo } = storeToRefs(useMap())
|
||||
<div v-if="state.status === 'pending'">Loading...</div>
|
||||
<div v-else-if="state.status === 'error'">Error: {{ state.error.message }}</div>
|
||||
<template v-else>
|
||||
<LMap ref="map" :min-zoom v-model:zoom="zoom" v-model:center="center" :options="{ zoomControl: false }"
|
||||
:useGlobalLeaflet="true">
|
||||
<LMap ref="map" :min-zoom v-model:zoom="zoom" :center="center" :max-bounds :max-bounds-viscosity
|
||||
:options="extraOptions" :useGlobalLeaflet="true">
|
||||
<LControlZoom position="bottomright" />
|
||||
|
||||
<LTileLayer v-once :url="MAP_TILELAYER_URL" layer-type="base" />
|
||||
|
||||
@@ -7,8 +7,16 @@ export const SPOTS_MAX = 99
|
||||
|
||||
export const useMap = defineStore('map', () => {
|
||||
const zoom = ref(10)
|
||||
const minZoom = 6
|
||||
const minZoom = 8
|
||||
const center = ref<PointTuple>([48.11180645878813, -1.6637869497745246])
|
||||
const topLeftCorner: PointTuple = [48.88261491330733, -3.437430524894775]
|
||||
const bottomRightCorner: PointTuple = [47.31027605502938, 0.6437600778583776]
|
||||
const maxBounds: PointTuple[] = [topLeftCorner, bottomRightCorner]
|
||||
const maxBoundsViscosity = 0.9
|
||||
|
||||
const extraOptions: Record<string, any> = {
|
||||
zoomControl: false,
|
||||
}
|
||||
|
||||
const maxClusterRadius = 28
|
||||
const disableClusteringAtZoom = 17
|
||||
@@ -26,8 +34,11 @@ export const useMap = defineStore('map', () => {
|
||||
zoom,
|
||||
minZoom,
|
||||
center,
|
||||
maxBounds,
|
||||
maxBoundsViscosity,
|
||||
maxClusterRadius,
|
||||
disableClusteringAtZoom,
|
||||
extraOptions,
|
||||
filterUncovered,
|
||||
filterCovered,
|
||||
filterKorrigo,
|
||||
|
||||
Reference in New Issue
Block a user