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
| /* eslint-disable no-undef */
| // import '@/lib/AMap';
|
| var mapInitDone = false;
| var onMapMountedEvents = [];
|
| // 地图对象
| var map;
| // 卫星图层
| var satellite;
| // 地图拖动控制
| var controlbar;
| // 鼠标绘图
| var mouseTool;
| // 3D图层
| var object3Dlayer;
| // 地图拖动状态
| var isDragging = false;
|
| // 地图加载完成触发
| function onMapMounted(...events) {
| if (mapInitDone) {
| events.forEach((e) => {
| e();
| });
| } else {
| onMapMountedEvents = onMapMountedEvents.concat(events);
| }
| }
|
| function createMap(id) {
| _initMap(id);
| mapInitDone = true;
| onMapMountedEvents.forEach((e) => {
| e();
| });
| onMapMountedEvents = [];
| }
|
| function _initMap(elementId) {
| map = new AMap.Map(elementId, {
| rotateEnable: true,
| pitchEnable: true,
| alwaysRender: false,
| showLabel: true,
| showBuildingBlock: true,
| mapStyle: 'amap://styles/e1e78509de64ddcd2efb4cb34c6fae2a',
| features: ['bg', 'road'],
| pitch: 45, // 地图俯仰角度，有效范围 0 度- 83 度
| viewMode: '3D', // 地图模式
| resizeEnable: true,
| center: [121.6039283, 31.25295567],
| zooms: [3, 18],
| zoom: 14
| });
|
| // 添加卫星地图
| satellite = new AMap.TileLayer.Satellite();
| satellite.show();
| map.add([satellite]);
|
| _initControlbar();
| // _initMouseTool();
| _init3DLayer();
| _initDragEvent();
| }
|
| function _initControlbar() {
| controlbar = new AMap.ControlBar({
| position: {
| right: '300px',
| top: '260px'
| }
| });
| map.addControl(controlbar);
| }
|
| // 鼠标绘图初始化
| // function _initMouseTool() {
| // mouseTool = new AMap.MouseTool(map);
| // }
|
| // 3D图层初始化
| function _init3DLayer() {
| object3Dlayer = new AMap.Object3DLayer();
| map.add(object3Dlayer);
| }
|
| // 设置地图拖拽监听事件
| function _initDragEvent() {
| let dragEndEvent;
| map.on('dragstart', () => {
| clearTimeout(dragEndEvent);
| isDragging = true;
| });
| map.on('dragend', function () {
| dragEndEvent = setTimeout(() => {
| isDragging = false;
| }, 8000);
| });
| }
|
| export {
| createMap,
| onMapMounted,
| map,
| controlbar,
| mouseTool,
| satellite,
| object3Dlayer,
| isDragging
| };
|
|
