systemMap.js
5.35 KB
1
2
3
4
5
6
7
8
9
10
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
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
;(function (window) {
var sysMapObj = null,
sysInfoWindowAll = {},
sysZoomNumber=12,
sysPointKey = "_point";
var mapApp = function (selector, lon = 113.34693, lat = 28.21849) {
return new mapApp.fn.init(selector, lon, lat);
}
mapApp.fn = mapApp.prototype = {
constructor: mapApp,
init: function (selector, lon, lat) {
this.selector = selector;
this.lon = lon;
this.lat = lat;
this.initMap = function () {
return this.initMapMethod();
}
this.createMarkerInfo = function (message, obj) {
return this.markerInfoMethod(message, obj)
}
this.getSysMapObj = function () {
return sysMapObj;
}
this.getLocateMarker = function (hhMarkerId) {
return this.getLocateMarkerMethod(hhMarkerId)
}
},
initMapMethod() {
if (document.querySelector("#" + this.selector).length == 0) {
alert(`初始化方法元素节点${"#" + this.selector}不存在!`);
return;
}
sysMapObj = new BMapGL.Map(this.selector);
sysMapObj.centerAndZoom(this.getPoint(), sysZoomNumber); //设置中心点
sysMapObj.enableScrollWheelZoom(true); // //开启鼠标滚轮缩放
var scaleCtrl = new BMapGL.ScaleControl(); // 添加比例尺控件
sysMapObj.addControl(scaleCtrl);
var zoomCtrl = new BMapGL.ZoomControl(); // 添加缩放控件
sysMapObj.addControl(zoomCtrl);
var cityCtrl = new BMapGL.CityListControl(); // 添加城市列表控件
sysMapObj.addControl(cityCtrl);
var locationCtrl = new BMapGL.LocationControl({
anchor: BMAP_ANCHOR_BOTTOM_RIGHT,
offset: new BMapGL.Size(10, 80)
});;
sysMapObj.addControl(locationCtrl);// 添加定位控件
//sysMapObj.setHeading(64.5);
//sysMapObj.setTilt(73);
return this;
},
/**
* 创建标注和信息框
* obj { title: x, longitude: longitude, latitude:latitude }
*/
markerInfoMethod: function (message, obj) {
let point = this.getPoint(obj.longitude, obj.latitude),
marker = new BMapGL.Marker(point), // 创建标注
markerId = obj.id.toString(); //自定义标注唯一ID
marker.hhId = markerId;
sysMapObj.addOverlay(marker); // 将标注添加到地图中
var opts = {
width: 300, // 信息窗口宽度
height: 100, // 信息窗口高度
title: obj.title, // 信息窗口标题
}
let infoWindow = new BMapGL.InfoWindow(message, opts); // 创建信息窗口对象
sysMapObj.openInfoWindow(infoWindow, point); //开启信息窗口
if (!sysInfoWindowAll[markerId]) {
sysInfoWindowAll[markerId] = infoWindow;
sysInfoWindowAll[markerId + sysPointKey] = point;
}
marker.addEventListener("click", function () {
sysMapObj.openInfoWindow(infoWindow, point); //开启信息窗口
});
return this;
},
getPoint(lon, lat) {
var longitude = lon ?? this.lon;
var latitude = lat ?? this.lat;
var point = new BMapGL.Point(longitude, latitude);
return point;
},
/**
* 地址解析经纬度
*/
getPointByAddress(address, successCallBack, errorCallBack) {
//创建地址解析器实例
var myGeo = new BMapGL.Geocoder();
// 将地址解析
myGeo.getPoint(address, function (point) {
if (point) {
successCallBack(point)
return;
}
successCallBack(null)
alert('您输入的地址没有解析到结果！');
}, function (err) {
alert("地址解析异常:", err);
})
},
/**
* 查找Marker并打开对应的infoWindow信息框
*/
getLocateMarkerMethod(markerId) {
var overlays = sysMapObj.getOverlays();
for (var i = 0; i < overlays.length; i++) {
var overlay = overlays[i];
if (overlay.hhId == markerId) {
var pos = overlay.getPosition();
sysMapObj.panTo(pos); // 定位到 Marker
overlay.setAnimation(BMAP_ANIMATION_BOUNCE); // 添加动画效果
let infoWindow = sysInfoWindowAll[markerId];
if (infoWindow) {
sysMapObj.centerAndZoom(pos, sysZoomNumber); //设置中心点
let point = sysInfoWindowAll[markerId + sysPointKey];
sysMapObj.openInfoWindow(infoWindow, point); // 打开对应的 infoWindow
}
break;
}
}
}
}
mapApp.fn.init.prototype = mapApp.fn;
window.mapApp = mapApp;
})(window, undefined);