1
0
forked from MTSR/mapserver
mapserver/static/js/components/Map.js
2019-09-18 11:53:58 +02:00

64 lines
1.5 KiB
JavaScript

import layerManager from '../LayerManager.js';
import { createMap } from '../map/MapFactory.js';
function setupMap(vnode){
const map = createMap(
vnode.dom,
layerManager.getCurrentLayer().id,
+vnode.attrs.zoom,
+vnode.attrs.lat,
+vnode.attrs.lon
);
vnode.state.map = map;
function updateHash(){
const center = map.getCenter();
const layerId = layerManager.getCurrentLayer().id;
m.route.set(`/map/${layerId}/${map.getZoom()}/` +
`${Math.floor(center.lng)}/${Math.floor(center.lat)}`);
}
map.on('zoomend', updateHash);
map.on('moveend', updateHash);
}
export default {
view(){
return m("div", { class: "full-screen" });
},
oncreate(vnode){
setupMap(vnode);
},
onbeforeupdate(newVnode) {
const center = newVnode.state.map.getCenter();
const newAattrs = newVnode.attrs;
return newAattrs.layerId != layerManager.getCurrentLayer().id ||
newAattrs.zoom != newVnode.state.map.getZoom() ||
Math.abs(newAattrs.lat - center.lat) > 2 ||
Math.abs(newAattrs.lat - center.lat) > 2;
},
onupdate(vnode){
if (vnode.attrs.layerId != layerManager.getCurrentLayer().id){
//layer changed, recreate map
vnode.state.map.remove();
layerManager.setLayerId(vnode.attrs.layerId);
setupMap(vnode);
} else {
//position/zoom change
vnode.state.map.setView([+vnode.attrs.lat, +vnode.attrs.lon], +vnode.attrs.zoom);
}
},
onremove(vnode){
vnode.state.map.remove();
}
};