Fix initial panel toggle
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
<script>
|
||||
import 'maplibre-gl/dist/maplibre-gl.css';
|
||||
import { Map, NavigationControl, Marker, LngLatBounds } from 'maplibre-gl';
|
||||
import { Map, NavigationControl, Marker, LngLatBounds, LngLat } from 'maplibre-gl';
|
||||
|
||||
import simplebar from 'simplebar-vue';
|
||||
|
||||
@@ -223,7 +223,13 @@ export default {
|
||||
}
|
||||
});
|
||||
|
||||
//Markers
|
||||
for(const oMsg of this.messages) {
|
||||
new Marker().setLngLat(new LngLat(oMsg.longitude, oMsg.latitude)).addTo(this.map);
|
||||
}
|
||||
|
||||
//Centering map
|
||||
let bOpenFeedPanel = !this.mobile;
|
||||
let oBounds = new LngLatBounds();
|
||||
if(
|
||||
this.project.mode == this.spot.consts.modes.blog &&
|
||||
@@ -236,6 +242,7 @@ export default {
|
||||
}
|
||||
else {
|
||||
//Fit to track
|
||||
console.log('Fit to track');
|
||||
for(const iFeatureId in oTrack.features) {
|
||||
oBounds = oTrack.features[iFeatureId].geometry.coordinates.reduce(
|
||||
(bounds, coord) => {
|
||||
@@ -245,10 +252,23 @@ export default {
|
||||
);
|
||||
}
|
||||
}
|
||||
await this.map.fitBounds(oBounds, {padding: 20, animate: false});
|
||||
const iFeedPanelPadding = bOpenFeedPanel?(getOuterWidth(this.$refs.feed)/2):0;
|
||||
await this.map.fitBounds(
|
||||
oBounds,
|
||||
{
|
||||
padding: {
|
||||
top: 20,
|
||||
bottom: 20,
|
||||
left: (20 + iFeedPanelPadding),
|
||||
right: (20 + iFeedPanelPadding)
|
||||
},
|
||||
animate: false,
|
||||
maxZoom: 15
|
||||
}
|
||||
);
|
||||
|
||||
//Toggle only when map is ready, for the tilt effet
|
||||
this.toggleFeedPanel(!this.mobile);
|
||||
this.toggleFeedPanel(bOpenFeedPanel);
|
||||
|
||||
//Default Basemap
|
||||
this.baseMap = this.baseMaps.filter((asBM)=>asBM.default_map)[0].codename;
|
||||
|
||||
@@ -139,7 +139,6 @@
|
||||
|
||||
.fa-message-in {
|
||||
top: -1px;
|
||||
left: -1px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user