Commit 0cb38a5b authored by lixy's avatar lixy

地图

parent 8d0f5726
...@@ -41,9 +41,17 @@ ...@@ -41,9 +41,17 @@
} }
}, },
mounted() { mounted() {
// let that = this;
// if(this.map){
// this.map.addEventListener("zoomend", function(e){
// var ZoomNum = that.map.getZoom();
// this.addMarker(map);
// });
// }
}, },
watch: { watch: {
provinceName(newValue, oldValue) { provinceName(newValue, oldValue) {
let that = this;
console.log(this.provinceName); console.log(this.provinceName);
if(this.map){ if(this.map){
if(this.provinceName == "兰州"){ if(this.provinceName == "兰州"){
...@@ -52,6 +60,11 @@ ...@@ -52,6 +60,11 @@
this.map.centerAndZoom(this.provinceName,6); this.map.centerAndZoom(this.provinceName,6);
} }
} }
// this.map.addEventListener("zoomend", function(e){
// var ZoomNum = that.map.getZoom();
// that.map.clearOverlays();//清空地图上标注点
// that.addMarker(this,map);
// });
}, },
}, },
methods: { methods: {
...@@ -80,22 +93,31 @@ ...@@ -80,22 +93,31 @@
}, },
handler({map}) { handler({map}) {
this.map = map; this.map = map;
let list = this.toSonData; page(this.listQuery)
.then(response => {
let listTemp = response.data.data;
let arr = [];
listTemp.map(function(item){
arr.push(item);
});
this.list = arr;
// 定位 // 定位
this.geolocation(map); this.geolocation(map);
// 产生随机点 // 产生随机点
const bounds = map.getBounds(); const bounds = map.getBounds();
for (let i = 0; i < list.length; i++) { for (let i = 0; i < arr.length; i++) {
const point = { const point = {
title: "",//list[i].name title: "",//list[i].name
point: { point: {
lng: list[i].longitude, lng: arr[i].longitude,
lat: list[i].latitude lat: arr[i].latitude
} }
}; };
this.pointList.push(point); this.pointList.push(point);
} }
this.addMarker(map); this.addMarker(map);
})
}, },
mapClick(map, e) { mapClick(map, e) {
const point = e.point; const point = e.point;
...@@ -108,6 +130,7 @@ ...@@ -108,6 +130,7 @@
const p = new BMap.Point(point.lng, point.lat); const p = new BMap.Point(point.lng, point.lat);
this.pickPoint = new BMap.Marker(p); this.pickPoint = new BMap.Marker(p);
this.addressDetail(point);//根据经纬度获取省市信息 this.addressDetail(point);//根据经纬度获取省市信息
// this.addMarker(map);
}, },
addressDetail(point){ //获取地理位置 addressDetail(point){ //获取地理位置
let mydata = getSonRegionByCodes(1); let mydata = getSonRegionByCodes(1);
...@@ -130,9 +153,17 @@ ...@@ -130,9 +153,17 @@
}); });
}, },
addMarker(map) { addMarker(map) {
let zoom = map.getZoom();
var myIcon = new BMap.Icon('https://cwmp.upyuns.com/attachment/images/4/2019/05/HnFr78H280dv972KuNZku70297rz7z.png',new BMap.Size(16,16));//这里先不用第三个参数IconOptions;
// if(zoom <6){
// myIcon = new BMap.Icon('https://cwmp.upyuns.com/attachment/images/4/2019/05/HnFr78H280dv972KuNZku70297rz7z.png',new BMap.Size(16,16));//这里先不用第三个参数IconOptions
// }
for (const item of this.pointList) { for (const item of this.pointList) {
const point = new BMap.Point(item.point.lng, item.point.lat); const point = new BMap.Point(item.point.lng, item.point.lat);
const mk = new BMap.Marker(point); var mk = new BMap.Marker(point, {icon:myIcon});
// if(zoom > 6){
// mk = new BMap.Marker(point);
// }
const label = new BMap.Label(item.title); const label = new BMap.Label(item.title);
label.setOffset(new BMap.Size(15, -15)); label.setOffset(new BMap.Size(15, -15));
label.setStyle({ label.setStyle({
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment