f1105655
 liuqimichale
map
|
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
|
name: 'VMap',
mounted(){
this.drawMap()
},
methods:{
drawMap(){
let data = [
{Name:'万达停车场1',lonId:'111.742579',latId:'40.818675',status:0,free:30,total:1000},
{Name:'万达停车场2',lonId:'111.622579',latId:'40.878675',status:1,free:40,total:800},
{Name:'万达停车场333333',lonId:'111.782579',latId:'40.778675',status:2,free:300,total:500}
];
var map = new BMap.Map('map', {enableMapClick: false})
var point = new BMap.Point(data[0].lonId, data[0].latId)
map.centerAndZoom(point, 15)
var mapStyle={ style : "midnight" }
map.enableScrollWheelZoom(false);
map.setMapStyle(mapStyle);
// var marker = new BMap.Marker(point) // 创建标注
// map.addOverlay(marker) // 将标注添加到地图中
map.clearOverlays();
var i = 0;
var points = [];
for (var item in data) {
(function (x) {
var itemthat = item;
//创建标注
var pt = new BMap.Point(data[item].lonId, data[item].latId);
points[i] = pt;
if(data[item].freeBrethNum/data[item].plBerthNum == 0){
var myIcon = new BMap.Icon(busyCar,
new BMap.Size(29, 40), {
offset: new BMap.Size(10, 40),
textColor: '#fff'
});
var marker = new BMap.Marker(pt,{icon:myIcon});
} else if(data[item].freeBrethNum/data[item].plBerthNum <= 0.3){
var myIcon = new BMap.Icon(normalCar,
new BMap.Size(29, 40), {
offset: new BMap.Size(10, 40),
textColor: '#fff'
});
var marker = new BMap.Marker(pt,{icon:myIcon});
} else {
var myIcon = new BMap.Icon(idleCar,
new BMap.Size(29, 40), {
offset: new BMap.Size(10, 40),
textColor: '#fff'
});
var marker = new BMap.Marker(pt,{icon:myIcon});
}
var myIcon = new BMap.Icon(busyCar,
new BMap.Size(29, 40), {
offset: new BMap.Size(10, 40),
textColor: '#fff'
});
marker.setTop(true,27000000);
map.addOverlay(marker);
var myLabel;
marker.addEventListener("mouseover", (e)=> {
map.removeOverlay(myLabel);
var that = this;
let tmpHtml = '';
for(let i=0;i<JSON.parse(data[itemthat].plRate).length;i++){
//console.log(data[itemthat].plRate)
tmpHtml += "<li>"+JSON.parse(data[itemthat].plRate)[i].standard+"</li>"
}
});
marker.addEventListener("mouseout", function (e) {
map.removeOverlay(myLabel);
});
i++;
})(i);
}
}
}
|
