map.js
13.1 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
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
/**
* 百度地图
*
* - - - - - -》init：地图初始化
*
* - - - - - -》getDistanceAndDuration：获取距离与时间
*
* - - - - - -》drawingUpline：在地图上画出上行线路走向
*
* - - - - - -》stationsPointsToLibraryPoint：根据站点坐标匹配库中的公交站点（手动规划）
*/
var BasicMap = function () {
/** BasicMap 全局变量定义 mapBValue：地图对象；polyUpline：走向折线；sectionList：截取过的路段 ；pointIndex：计算路段被切的次数;
* firstPoint:截取路段的第一个点;iseditStatus：路段是否在编辑状态；isCutSection ： 获取路段是否在截取状态*/
var mapBValue = '', polyUpline='', sectionList = [], pointIndex = 0, iseditStatus = false, firstPoint = {}, isCutSection = false;
var Bmap = {
init : function() {
// 设置中心点,
var CENTER_POINT = {lng : 121.528733,lat : 31.237425};
// 百度API Key
var bdKey = '1TgEKvYqohJyeGXnN6yHSSTb4psOarQw';
// 初始化百度地图
mapBValue = new BMap.Map("BasicMap");
//中心点和缩放级别
mapBValue.centerAndZoom(new BMap.Point(CENTER_POINT.lng,CENTER_POINT.lat),15);
//启用地图拖拽事件，默认启用(可不写)
mapBValue.enableDragging();
//启用地图滚轮放大缩小
mapBValue.enableScrollWheelZoom();
//禁用鼠标双击放大
mapBValue.disableDoubleClickZoom();
//启用键盘上下左右键移动地图
mapBValue.enableKeyboard();
return mapBValue;
},
/** 获取第一个切路段的点 @return Point*/
getFirstPoint : function() {
return firstPoint;
},
/** 获取地图对象 @return 地图对象map */
getmapBValue : function() {
return mapBValue;
},
getPolyUpline : function() {
return polyUpline;
},
/** 获取截取过的路段 @return 路段对象List */
getSectionList : function() {
return sectionList;
},
setSectionList : function(list) {
sectionList = list;
},
initCutSectionPoint : function() {
sectionList = [];
var tbodyHtml = template('section_list',{list : sectionList});
$('#section_table tbody').html(tbodyHtml);
},
/** 获取切路段的点下标 @return int*/
setPointIndex : function(index) {
pointIndex = index;
},
getPointIndex : function() {
return pointIndex;
},
/** 获取路段是否在编辑状态 @return boolean*/
getIsEditStatus : function() {
return iseditStatus;
},
setIsEditStatus : function(v) {
iseditStatus = v ;
},
/** 获取路段是否在截取状态 @return boolean*/
getIsCutSection : function() {
return isCutSection;
},
setIsCutSection : function(v) {
isCutSection = v ;
},
/** 获取距离与时间 @param <points：坐标点集合> */
getDistanceAndDuration : function(points,callback){
// 获取长度
var len = points.length;
(function(){
if (!arguments.callee.count) {
arguments.callee.count = 0;
}
arguments.callee.count++;
var index = parseInt(arguments.callee.count) - 1;
if (index >= len-1) {
callback && callback(points);
return;
}
// 当函数被调用时，它的arguments.callee对象就会指向自身，也就是一个对自己的引用。(当前正在执行的函数。)
var f = arguments.callee;
// 起点坐标 <坐标格式：40.056878,116.30815>
var origin = points[index].potion.lat + ',' + points[index].potion.lng;
// 终点坐标 <坐标格式：40.056878,116.30815>
var destination = points[index+1].potion.lat + ',' + points[index+1].potion.lng;
var region = '上海';
var origin_region = '上海';
var destination_region = '上海';
var output = 'json';
var ak_My = 'wjlITmXeCek5MxyU3ZUBkTeU8B0o0npk';
/**
* origin：起点名称或经纬度；
*
* destination：终点名称或经纬度；
*
* origin_region：起始点所在城市，驾车导航时必填。
*
* destination_region：终点所在城市，驾车导航时必填。
*
* output :表示输出类型，可设置为xml或json，默认为xml。
*
**/
var paramsB = {origin:origin,destination:destination,region:region,origin_region:origin_region,destination_region:destination_region,output:output,ak:ak_My};
/** @description :未认证开发者默认配额为：2000次/天。 */
$.ajax({
// 百度地图根据坐标获取两点之间的时间与距离
url: '//api.map.baidu.com/direction/v1?mode=transit',
data: paramsB,
dataType: 'jsonp',
success: function(r){
if(r) {
if(r.message=='ok') {
if(r.result.taxi==null) {
// 获取距离(单位：米)
points[index+1].distance = 0;
// 获取时间(单位：秒)
points[index+1].duration = 0;
}else {
// 获取距离(单位：米)
points[index+1].distance = r.result.taxi.distance;
// 获取时间(单位：秒)
points[index+1].duration = r.result.taxi.duration;
}
}
}
f();
}
});
})();
},
// 在地图上画出上行线路走向
drawingUpline01 : function (polylineArray,polyline_center,data) {
var polyUpline01 = 'polyline' + '_' + data.sectionrouteId;
// 创建线路走向
polyUpline01 = new BMap.Polyline(polylineArray, {strokeColor : "blue",strokeWeight : 6,strokeOpacity : 0.5});
polyUpline01.data = data;
// 把折线添加到地图上
mapBValue.addOverlay(polyUpline01);
var sectionPoint = [];
// 线路单击事件
polyUpline01.addEventListener('click',function(e) {
if(BasicMap.getIsEditStatus()) {
layer.msg('请先保存正在编辑的路段信息...');
return false;
}
if(BasicMap.getIsCutSection()) {
layer.msg('请先撤销所有切路段的点...');
return false;
}
polyUpline01.enableEditing();
BasicMap.setIsEditStatus(true);
});
// 添加路段双击事件
polyUpline01.addEventListener("dblclick",function(e){
if(BasicMap.getIsCutSection()) {
layer.msg('请先撤销所有切路段的点...');
return false;
}
BasicMap.setIsEditStatus(false);
// 关闭
layer.closeAll();
polyUpline01.disableEditing();
EditSectionObj.setEitdSection(polyUpline01.data);
// 获取折线坐标集合
var editPloyLineArray = polyUpline01.getPath();
EditSectionObj.setEitdBsectionVector(JSON.stringify(editPloyLineArray));
sectionList = [];
var tbodyHtml = template('section_list',{list : sectionList});
// 截取路段
$('#section_table tbody').html(tbodyHtml);
// 加载修改路段弹出层mobal页面
$.get('editsection.html', function(m){
$(pjaxContainer).append(m);
$('#edit_section_mobal_cache').trigger('editSectionMobalCache_show', [BasicMap,GetAjaxData,EditSectionObj,PublicFunctions]);
});
});
// 路段右击事件
var editSection = function(e,ee,marker){
if(BasicMap.getIsEditStatus()) {
layer.msg('请先保存正在编辑的路段信息...');
return false;
}
var lng = e.lng;
var lat = e.lat;
var sectionName = null;
var marker = new BMap.Marker(new BMap.Point(lng, lat)); // 创建点
marker.isFlag = true;
if(pointIndex == 0) {
sectionPoint[pointIndex] = {lng:lng , lat:lat};
layer.msg('进入切路段状态，请选择本路段的终点！');
mapBValue.addOverlay(marker);// 添加覆盖物
firstPoint = {lng:lng, lat:lat};
pointIndex++;
EditSectionObj.setEitdSection(polyUpline01.data);
// 获取折线坐标集合
var editPloyLineArray = polyUpline01.getPath();
EditSectionObj.setEitdBsectionVector(JSON.stringify(editPloyLineArray));
} else if (pointIndex > 0) {
layer.prompt({title: '请输入路段名！'}, function(sectionName, index){
pointList = [];
sectionPoint[pointIndex] = {lng:lng , lat:lat};
pointList[0] = sectionPoint[pointIndex-1];
pointList[1] = sectionPoint[pointIndex];
sectionList.push({name:sectionName, section:pointList});
layer.close(index);
layer.msg('路段截取成功，请选择下一个路段的终点');
mapBValue.addOverlay(marker);// 添加覆盖物
var tbodyHtml = template('section_list',{list : sectionList});
// 截取路段
$('#section_table tbody').html(tbodyHtml);
pointIndex++;
});
}
BasicMap.setIsCutSection(true);
}
var markerMenu=new BMap.ContextMenu();
markerMenu.addItem(new BMap.MenuItem('切路段',editSection.bind(polyUpline01)));
polyUpline01.addContextMenu(markerMenu);
var PanOptions_ ={noAnimation :true};
mapBValue.reset();
mapBValue.panTo(polyline_center,PanOptions_);
mapBValue.panBy(500,-510,PanOptions_);
mapBValue.setZoom(14);
},
// 删除点刷新cutSectionTable
refreshCutSectionTable : function() {
var tbodyHtml = template('section_list',{list : sectionList});
$('#section_table tbody').html(tbodyHtml);
},
// 删除点刷新覆盖物
deleteCutSectionPoint : function(point) {
var lng = point.lng;
var lat = point.lat;
var allOverlay = mapBValue.getOverlays();
// 删除最后一个点
for (var i = 0; i < allOverlay.length -1; i++){
if(allOverlay[i].isFlag) {
if(allOverlay[i].point.lng == lng && allOverlay[i].point.lat == lat){
mapBValue.removeOverlay(allOverlay[i]);
break;
}
}
}
},
/** 在地图上画点 @param：<point_center：中心坐标点> */
drawingUpStationPoint : function(point_center,stationName,s) {
// 自定义标注物图片
var icon_target = new BMap.Icon('/pages/base/stationroute/css/img/gjzd.png',new BMap.Size(10, 10));
var html2 = '<div style="position: absolute; margin: 0pt; padding: 0pt; width: 160px; height: 26px; left: -10px; top: -35px; overflow: hidden;">'
+ '<img class="rm3_image" style="border:none;left:0px; top:0px; position:absolute;" src="/pages/base/stationroute/css/img/back160.png">'
+ '</div>'
+ '<label class=" BMapLabel" unselectable="on" style="position: absolute; -moz-user-select: none; display: inline; cursor: inherit; border: 0px none; padding: 2px 1px 1px; white-space: nowrap; font: 12px arial,simsun; z-index: 80; color: rgb(255, 102, 0); left: 15px; top: -35px;"><span style="float: left; color: #fdfdfd; margin-left: -22px; font-size: 6px;">'+ s+'</span>'+ stationName+'</label>';
var myRichMarker1 = new BMapLib.RichMarker(html2, point_center,{
"anchor" : new BMap.Size(-10,8),
"enableDragging" : true});
myRichMarker1.disableDragging();
mapBValue.addOverlay(myRichMarker1);
// 创建标注物
marker = new BMap.Marker(point_center,{icon : icon_target});
// 允许覆盖物在map.clearOverlays方法中被清除。
marker.enableMassClear();
mapBValue.addOverlay(marker);
},
// 根据站点坐标匹配库中的公交站点（手动规划）
stationsPointsToLibraryPoint : function(arra,callback) {
// 获取长度
var len = arra.length;
var station = {};
var stationList = [];
(function(){
if (!arguments.callee.count) {
arguments.callee.count = 0;
}
arguments.callee.count++;
var index = parseInt(arguments.callee.count) - 1;
if (index >= len) {
callback && callback(stationList);
return ;
}
var f = arguments.callee;
station = arra[index];
if(arra[index].name!=''){
$.get('/station/matchStation',station,function(result) {
var centerPointWkt = result.centerPointWkt, idx = centerPointWkt.indexOf('POINT(');
centerPointWkt = idx > -1 ? centerPointWkt.substring(6, centerPointWkt.length - 1) : centerPointWkt;
var coordinates = centerPointWkt.split(' ');
stationList.push({name: result.name ,wgs: arra[index].wgs, potion: {lng: coordinates[0], lat: coordinates[1]}, isHave: result.isHave, id: result.id});
f();
});
}else {
f();
}
})()
},
clearMarkAndOverlays : function() {
// 清楚地图覆盖物
mapBValue.clearOverlays();
mapBValue.removeOverlay();
}
}
return Bmap;
}();