Do not move map on flat click
This commit is contained in:
parent
36e98bc5b3
commit
0f2a14b024
@ -101,7 +101,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<h3>{{ $t("flatsDetails.Location") }}</h3>
|
<h3>{{ $t("flatsDetails.Location") }}</h3>
|
||||||
|
|
||||||
<FlatsMap :flats="flatMarkers" :places="timeToPlaces" :journeys="journeys"></FlatsMap>
|
<FlatsMap :flats="flatMarker" :places="timeToPlaces" :journeys="journeys"></FlatsMap>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<h3>{{ $t("flatsDetails.Notes") }}</h3>
|
<h3>{{ $t("flatsDetails.Notes") }}</h3>
|
||||||
@ -239,7 +239,7 @@ export default {
|
|||||||
isLoading () {
|
isLoading () {
|
||||||
return this.$store.getters.isLoading
|
return this.$store.getters.isLoading
|
||||||
},
|
},
|
||||||
flatMarkers () {
|
flatMarker () {
|
||||||
return this.$store.getters.flatsMarkers(this.$router, flat => flat.id === this.flat.id)
|
return this.$store.getters.flatsMarkers(this.$router, flat => flat.id === this.flat.id)
|
||||||
},
|
},
|
||||||
'flatpickrValue' () {
|
'flatpickrValue' () {
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
<template lang="html">
|
<template lang="html">
|
||||||
<div class="full">
|
<div class="full">
|
||||||
<v-map :zoom="zoom.defaultZoom" :center="center" :bounds="bounds" :min-zoom="zoom.minZoom" :max-zoom="zoom.maxZoom" v-on:click="$emit('select-flat', null)">
|
<v-map v-if="bounds" :zoom="zoom.defaultZoom" :bounds="bounds" :min-zoom="zoom.minZoom" :max-zoom="zoom.maxZoom" v-on:click="$emit('select-flat', null)" @update:bounds="bounds = $event">
|
||||||
<v-tilelayer :url="tiles.url" :attribution="tiles.attribution"></v-tilelayer>
|
<v-tilelayer :url="tiles.url" :attribution="tiles.attribution"></v-tilelayer>
|
||||||
<v-marker-cluster>
|
<v-marker-cluster>
|
||||||
<template v-for="marker in flats">
|
<template v-for="marker in flats">
|
||||||
@ -20,6 +20,7 @@
|
|||||||
<v-geojson-layer :geojson="journey.geojson" :options="Object.assign({}, defaultGeoJSONOptions, journey.options)"></v-geojson-layer>
|
<v-geojson-layer :geojson="journey.geojson" :options="Object.assign({}, defaultGeoJSONOptions, journey.options)"></v-geojson-layer>
|
||||||
</template>
|
</template>
|
||||||
</v-map>
|
</v-map>
|
||||||
|
<div v-else>Nothing to display yet</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -53,7 +54,7 @@ export default {
|
|||||||
fillColor: '#e4ce7f',
|
fillColor: '#e4ce7f',
|
||||||
fillOpacity: 1
|
fillOpacity: 1
|
||||||
},
|
},
|
||||||
center: [46.449, 2.210],
|
bounds: [[40.91351257612758, -7.580566406250001], [51.65892664880053, 12.0849609375]],
|
||||||
zoom: {
|
zoom: {
|
||||||
defaultZoom: 6,
|
defaultZoom: 6,
|
||||||
minZoom: 5,
|
minZoom: 5,
|
||||||
@ -83,17 +84,18 @@ export default {
|
|||||||
'v-geojson-layer': LGeoJSON
|
'v-geojson-layer': LGeoJSON
|
||||||
},
|
},
|
||||||
|
|
||||||
computed: {
|
watch: {
|
||||||
bounds () {
|
flats: 'computeBounds',
|
||||||
let bounds = []
|
places: 'computeBounds'
|
||||||
this.flats.forEach(flat => bounds.push(flat.gps))
|
},
|
||||||
Object.keys(this.places).forEach(place => bounds.push(this.places[place]))
|
|
||||||
|
|
||||||
if (bounds.length > 0) {
|
methods: {
|
||||||
bounds = L.latLngBounds(bounds)
|
computeBounds (newData, oldData) {
|
||||||
return bounds
|
if (this.flats.length && JSON.stringify(newData) !== JSON.stringify(oldData)) {
|
||||||
} else {
|
const allBounds = []
|
||||||
return null
|
this.flats.forEach(flat => allBounds.push(flat.gps))
|
||||||
|
Object.keys(this.places).forEach(place => allBounds.push(this.places[place]))
|
||||||
|
this.bounds = allBounds.length ? L.latLngBounds(allBounds) : undefined
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
@ -38,8 +38,8 @@ export default {
|
|||||||
)
|
)
|
||||||
if (previousMarker) {
|
if (previousMarker) {
|
||||||
// randomize position a bit
|
// randomize position a bit
|
||||||
gps[0] += (Math.random() - 0.5) / 500
|
// gps[0] += (Math.random() - 0.5) / 500
|
||||||
gps[1] += (Math.random() - 0.5) / 500
|
// gps[1] += (Math.random() - 0.5) / 500
|
||||||
}
|
}
|
||||||
const href = router.resolve({ name: 'details', params: { id: flat.id }}).href
|
const href = router.resolve({ name: 'details', params: { id: flat.id }}).href
|
||||||
const cost = flat.cost ? ' ( ' + flat.cost + '€)' : ''
|
const cost = flat.cost ? ' ( ' + flat.cost + '€)' : ''
|
||||||
|
Loading…
Reference in New Issue
Block a user