Supermap 图层切换之利用图层切换控件实现不同图层的切换

话不多说,直接上代码

整理关键的代码如下

Map.layer = {
	bxgLayer: L.supermap.tiledMapLayer(bxgLayerUrl),
	wnLayer: L.supermap.tiledMapLayer(wnLayerUrl),
	hnLayer: L.supermap.tiledMapLayer(hnLayerUrl)
};
Map.centerZoom = {
	default: 6
};

Map.loadMap = function(){
	Map.map = L.map(mapContainerId, {
			crs: L.CRS.EPSG4326,
			preferCanvas: true,
			center: [39.952649, 116.329327],
			minZoom: 6,
			maxZoom: 15,
			zoom: 6,
			attributionControl: false,
			zoomControl: false,
			layers: [Map.layer.bxgLayer]
		});
	//所有基础用于切换的图层
	let baseMaps = {
		'北下关' : Map.layer.bxgLayer,
		'万水泉南' : Map.layer.wnLayer,
		'海勒斯壕南': Map.layer.hnLayer
	};
	//添加图层切换工具
	L.control.layers(baseMaps).addTo(Map.map);
	L.control.scale({position: 'bottomright'}).addTo(Map.map);
	L.control.zoom({position: 'topright', zoomInTitle: '放大', zoomOutTitle: '缩小'}).addTo(Map.map);
	Map.map.off("dblclick");
	Map.map.on("zoomend",e => {
		let currentZoom = e.target.getZoom();
		console.log(currentZoom);
	});
}

//根据图层设置对应的地图中心点
Map.changeMapCenter = function(layerName){
	let center = Map.center[layerName];
	let defaultZoom = Map.centerZoom.default;
	if (map.getZoom() >= defaultZoom) {
		Map.map.flyTo([lat, lng]);
	} else {
		Map.map.flyTo([lat, lng], defaultZoom);
	}
}

你可能感兴趣的:(supermap,leaflet,图层切换,控件)