绘制危化省市边界 gengdidi

dcit-hcsystem-hcsystem-master/src/utils/mapUtil.js

@@ -306,14 +306,36 @@ export default class Mutil {
 		//对获取的点坐标数据进行处理，重构，得到我们需要的数据结构
 		for (let i = 0; i < points.length; i++) {
 			let region = points[i];   //单个面
-			//let pointArr = region.split(',');
-			//let p = pointArr[j];
 			let pArr = region.split(',');
 			let pos = fromLonLat(pArr);  //将坐标转为默认投影，默认投影是EPSG：3857
-			let hdms = transform(pos, 'EPSG:3857', 'EPSG:4326');   //坐标系间坐标转换，由前面的坐标转为后面坐标系坐标
-			pointsz.push(pArr)    //将转化格式后的点坐标存储起来
+			//let hdms = transform(pos, 'EPSG:3857', 'EPSG:4326');   //坐标系间坐标转换，由前面的坐标转为后面坐标系坐标
+			pointsz.push(pos)    //将转化格式后的点坐标存储起来
 		};
 		//自己造的地图数据（GeoJSON数据）
+        let geojsonObject = this.structureGeojson(pointsz);
+		let vectorSource = new VectorSource({   //提供矢量图层的数据
+			features: (new GeoJSON().readFeatures(geojsonObject))
+		});
+		let vectorLayer = new VectorLayer({
+			source: vectorSource,   //来源
+			style: new Style({
+				stroke: new Stroke({
+					color: '#08d527',
+					width: 4
+				}),
+				fill: new Fill({
+					color: 'rgba(212, 220, 29, 0.1)'
+				})
+			})
+		});
+		if (this.tempLayer != ' ') {
+			this.MAP.removeLayer(this.tempLayer);
+		}
+		
+		this.MAP.addLayer(vectorLayer);
+		this.tempLayer = vectorLayer;
+	}
+    structureGeojson(pointsz){
 		let geojsonObject = {
 			'type': 'FeatureCollection',    //要素集合
 			'crs': {
@@ -333,39 +355,15 @@ export default class Mutil {
 				}
 			}]
 		};
-		let vectorSource = new VectorSource({   //提供矢量图层的数据
-			features: (new GeoJSON().readFeatures(geojsonObject))
-		});
-		let vectorLayer = new VectorLayer({
-			source: vectorSource,   //来源
-			style: new Style({
-				stroke: new Stroke({
-					color: 'yellow',
-					width: 6
-				}),
-				fill: new Fill({
-					color: 'rgba(255,255,0,0.1)'
-				})
-			})
-		});
-		if (this.tempLayer != ' ') {
-			this.MAP.removeLayer(this.tempLayer);
-		}
-		
-		this.MAP.addLayer(vectorLayer);
-		this.tempLayer = vectorLayer;
+		return geojsonObject;
 	}
 
-	changeCenter(name) {  //根据name传参
+    getBoundaries(name) {  //根据name传参
 		axios.get('https://restapi.amap.com/v3/config/district?key=cb087c0fb3b8bc56a4af064630495bb9&subdistrict=0&extensions=all&keywords='+name).then(res => {
-			
             let local = res.data.districts[0].center.split(",");
-			let view = new View({
-				center: transform(fromLonLat(local), 'EPSG:3857', 'EPSG:4326'),    //将中心点坐标转为EPSG：4326
-				projection: get('EPSG:4326'),   //投影坐标系 EPSG：4326
-				zoom: 10
-			});
-			this.MAP.setView(view);
+            let view = this.MAP.getView();
+            view.setCenter(fromLonLat(local));
+            view.setZoom(10);
 			this.drawArea(res.data.districts[0])
 		})
 	}

dcit-hcsystem-hcsystem-master/src/views/qyMap/qyMap.vue

@@ -261,7 +261,7 @@ export default class GIS extends Vue {
             if (id) that.getPopcon(id);
         })
         this.getStatiData();
-        this.Mutil.changeCenter("石家庄");
+        this.Mutil.getBoundaries("石家庄");
     }
 	getStatiData() {
 	  let that = this;