@antv/l7-component 2.15.5 → 2.16.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/assets/iconfont/iconfont.js +17 -10
- package/es/control/baseControl/buttonControl.js +42 -9
- package/es/control/baseControl/control.js +54 -25
- package/es/control/baseControl/popperControl.js +24 -10
- package/es/control/baseControl/selectControl.js +45 -6
- package/es/control/exportImage.js +116 -76
- package/es/control/fullscreen.js +53 -20
- package/es/control/geoLocate.js +66 -36
- package/es/control/layerSwitch.js +31 -0
- package/es/control/logo.js +14 -2
- package/es/control/mapTheme.js +32 -7
- package/es/control/mouseLocation.js +23 -2
- package/es/control/scale.js +29 -6
- package/es/control/zoom.js +23 -0
- package/es/index.js +12 -2
- package/es/marker-layer.js +75 -41
- package/es/marker.js +83 -29
- package/es/popup/layerPopup.js +82 -31
- package/es/popup/popup.js +127 -48
- package/es/utils/anchor.js +7 -3
- package/es/utils/popper.js +64 -15
- package/es/utils/screenfull.js +52 -23
- package/lib/assets/iconfont/iconfont.js +17 -10
- package/lib/control/baseControl/buttonControl.js +52 -9
- package/lib/control/baseControl/control.js +69 -25
- package/lib/control/baseControl/index.js +8 -0
- package/lib/control/baseControl/popperControl.js +29 -10
- package/lib/control/baseControl/selectControl.js +60 -6
- package/lib/control/exportImage.js +125 -76
- package/lib/control/fullscreen.js +60 -20
- package/lib/control/geoLocate.js +75 -36
- package/lib/control/layerSwitch.js +36 -0
- package/lib/control/logo.js +26 -2
- package/lib/control/mapTheme.js +42 -7
- package/lib/control/mouseLocation.js +33 -2
- package/lib/control/scale.js +40 -6
- package/lib/control/zoom.js +33 -0
- package/lib/index.js +41 -0
- package/lib/marker-layer.js +86 -39
- package/lib/marker.js +91 -29
- package/lib/popup/layerPopup.js +94 -29
- package/lib/popup/popup.js +139 -48
- package/lib/utils/anchor.js +9 -4
- package/lib/utils/icon.js +2 -0
- package/lib/utils/popper.js +71 -14
- package/lib/utils/screenfull.js +54 -23
- package/package.json +6 -6
package/lib/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
@@ -20,10 +21,15 @@ Object.defineProperty(exports, "MarkerLayer", {
|
|
|
20
21
|
return _markerLayer.default;
|
|
21
22
|
}
|
|
22
23
|
});
|
|
24
|
+
|
|
23
25
|
var _marker = _interopRequireDefault(require("./marker"));
|
|
26
|
+
|
|
24
27
|
var _markerLayer = _interopRequireDefault(require("./marker-layer"));
|
|
28
|
+
|
|
25
29
|
require("./assets/iconfont/iconfont.js");
|
|
30
|
+
|
|
26
31
|
var _baseControl = require("./control/baseControl");
|
|
32
|
+
|
|
27
33
|
Object.keys(_baseControl).forEach(function (key) {
|
|
28
34
|
if (key === "default" || key === "__esModule") return;
|
|
29
35
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -35,7 +41,9 @@ Object.keys(_baseControl).forEach(function (key) {
|
|
|
35
41
|
}
|
|
36
42
|
});
|
|
37
43
|
});
|
|
44
|
+
|
|
38
45
|
var _exportImage = require("./control/exportImage");
|
|
46
|
+
|
|
39
47
|
Object.keys(_exportImage).forEach(function (key) {
|
|
40
48
|
if (key === "default" || key === "__esModule") return;
|
|
41
49
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -47,7 +55,9 @@ Object.keys(_exportImage).forEach(function (key) {
|
|
|
47
55
|
}
|
|
48
56
|
});
|
|
49
57
|
});
|
|
58
|
+
|
|
50
59
|
var _fullscreen = require("./control/fullscreen");
|
|
60
|
+
|
|
51
61
|
Object.keys(_fullscreen).forEach(function (key) {
|
|
52
62
|
if (key === "default" || key === "__esModule") return;
|
|
53
63
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -59,7 +69,9 @@ Object.keys(_fullscreen).forEach(function (key) {
|
|
|
59
69
|
}
|
|
60
70
|
});
|
|
61
71
|
});
|
|
72
|
+
|
|
62
73
|
var _geoLocate = require("./control/geoLocate");
|
|
74
|
+
|
|
63
75
|
Object.keys(_geoLocate).forEach(function (key) {
|
|
64
76
|
if (key === "default" || key === "__esModule") return;
|
|
65
77
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -71,7 +83,9 @@ Object.keys(_geoLocate).forEach(function (key) {
|
|
|
71
83
|
}
|
|
72
84
|
});
|
|
73
85
|
});
|
|
86
|
+
|
|
74
87
|
var _layerSwitch = require("./control/layerSwitch");
|
|
88
|
+
|
|
75
89
|
Object.keys(_layerSwitch).forEach(function (key) {
|
|
76
90
|
if (key === "default" || key === "__esModule") return;
|
|
77
91
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -83,7 +97,9 @@ Object.keys(_layerSwitch).forEach(function (key) {
|
|
|
83
97
|
}
|
|
84
98
|
});
|
|
85
99
|
});
|
|
100
|
+
|
|
86
101
|
var _logo = require("./control/logo");
|
|
102
|
+
|
|
87
103
|
Object.keys(_logo).forEach(function (key) {
|
|
88
104
|
if (key === "default" || key === "__esModule") return;
|
|
89
105
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -95,7 +111,9 @@ Object.keys(_logo).forEach(function (key) {
|
|
|
95
111
|
}
|
|
96
112
|
});
|
|
97
113
|
});
|
|
114
|
+
|
|
98
115
|
var _mapTheme = require("./control/mapTheme");
|
|
116
|
+
|
|
99
117
|
Object.keys(_mapTheme).forEach(function (key) {
|
|
100
118
|
if (key === "default" || key === "__esModule") return;
|
|
101
119
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -107,7 +125,9 @@ Object.keys(_mapTheme).forEach(function (key) {
|
|
|
107
125
|
}
|
|
108
126
|
});
|
|
109
127
|
});
|
|
128
|
+
|
|
110
129
|
var _mouseLocation = require("./control/mouseLocation");
|
|
130
|
+
|
|
111
131
|
Object.keys(_mouseLocation).forEach(function (key) {
|
|
112
132
|
if (key === "default" || key === "__esModule") return;
|
|
113
133
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -119,7 +139,9 @@ Object.keys(_mouseLocation).forEach(function (key) {
|
|
|
119
139
|
}
|
|
120
140
|
});
|
|
121
141
|
});
|
|
142
|
+
|
|
122
143
|
var _scale = require("./control/scale");
|
|
144
|
+
|
|
123
145
|
Object.keys(_scale).forEach(function (key) {
|
|
124
146
|
if (key === "default" || key === "__esModule") return;
|
|
125
147
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -131,7 +153,9 @@ Object.keys(_scale).forEach(function (key) {
|
|
|
131
153
|
}
|
|
132
154
|
});
|
|
133
155
|
});
|
|
156
|
+
|
|
134
157
|
var _zoom = require("./control/zoom");
|
|
158
|
+
|
|
135
159
|
Object.keys(_zoom).forEach(function (key) {
|
|
136
160
|
if (key === "default" || key === "__esModule") return;
|
|
137
161
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -143,7 +167,9 @@ Object.keys(_zoom).forEach(function (key) {
|
|
|
143
167
|
}
|
|
144
168
|
});
|
|
145
169
|
});
|
|
170
|
+
|
|
146
171
|
var _interface = require("./interface");
|
|
172
|
+
|
|
147
173
|
Object.keys(_interface).forEach(function (key) {
|
|
148
174
|
if (key === "default" || key === "__esModule") return;
|
|
149
175
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -155,7 +181,9 @@ Object.keys(_interface).forEach(function (key) {
|
|
|
155
181
|
}
|
|
156
182
|
});
|
|
157
183
|
});
|
|
184
|
+
|
|
158
185
|
var _layerPopup = require("./popup/layerPopup");
|
|
186
|
+
|
|
159
187
|
Object.keys(_layerPopup).forEach(function (key) {
|
|
160
188
|
if (key === "default" || key === "__esModule") return;
|
|
161
189
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -167,7 +195,9 @@ Object.keys(_layerPopup).forEach(function (key) {
|
|
|
167
195
|
}
|
|
168
196
|
});
|
|
169
197
|
});
|
|
198
|
+
|
|
170
199
|
var _popup = require("./popup/popup");
|
|
200
|
+
|
|
171
201
|
Object.keys(_popup).forEach(function (key) {
|
|
172
202
|
if (key === "default" || key === "__esModule") return;
|
|
173
203
|
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
@@ -179,35 +209,46 @@ Object.keys(_popup).forEach(function (key) {
|
|
|
179
209
|
}
|
|
180
210
|
});
|
|
181
211
|
});
|
|
212
|
+
|
|
182
213
|
// 引入样式
|
|
183
214
|
function loadStyles(css, doc) {
|
|
184
215
|
var isMiniAli = typeof my !== 'undefined' && !!my && typeof my.showToast === 'function' && my.isFRM !== true;
|
|
185
216
|
var isWeChatMiniProgram = typeof wx !== 'undefined' && wx !== null && (typeof wx.request !== 'undefined' || typeof wx.miniProgram !== 'undefined');
|
|
217
|
+
|
|
186
218
|
if (isMiniAli || isWeChatMiniProgram) {
|
|
187
219
|
return;
|
|
188
220
|
}
|
|
221
|
+
|
|
189
222
|
if (!doc) doc = document;
|
|
223
|
+
|
|
190
224
|
if (!doc) {
|
|
191
225
|
return;
|
|
192
226
|
}
|
|
227
|
+
|
|
193
228
|
var head = doc.head || doc.getElementsByTagName('head')[0];
|
|
229
|
+
|
|
194
230
|
if (!head) {
|
|
195
231
|
head = doc.createElement('head');
|
|
196
232
|
var body = doc.body || doc.getElementsByTagName('body')[0];
|
|
233
|
+
|
|
197
234
|
if (body) {
|
|
198
235
|
body.parentNode.insertBefore(head, body);
|
|
199
236
|
} else {
|
|
200
237
|
doc.documentElement.appendChild(head);
|
|
201
238
|
}
|
|
202
239
|
}
|
|
240
|
+
|
|
203
241
|
var style = doc.createElement('style');
|
|
204
242
|
style.type = 'text/css';
|
|
243
|
+
|
|
205
244
|
if (style.styleSheet) {
|
|
206
245
|
style.styleSheet.cssText = css;
|
|
207
246
|
} else {
|
|
208
247
|
style.appendChild(doc.createTextNode(css));
|
|
209
248
|
}
|
|
249
|
+
|
|
210
250
|
head.appendChild(style);
|
|
211
251
|
return style;
|
|
212
252
|
}
|
|
253
|
+
|
|
213
254
|
loadStyles(".l7-marker-container {\n position: absolute;\n width: 100%;\n height: 100%;\n overflow: hidden;\n}\n.l7-marker {\n position: absolute !important;\n top: 0;\n left: 0;\n z-index: 5;\n cursor: pointer;\n}\n.l7-marker-cluster {\n width: 40px;\n height: 40px;\n background-color: rgba(181, 226, 140, 0.6);\n background-clip: padding-box;\n border-radius: 20px;\n}\n.l7-marker-cluster div {\n width: 30px;\n height: 30px;\n margin-top: 5px;\n margin-left: 5px;\n font: 12px 'Helvetica Neue', Arial, Helvetica, sans-serif;\n text-align: center;\n background-color: rgba(110, 204, 57, 0.6);\n border-radius: 15px;\n}\n.l7-marker-cluster span {\n line-height: 30px;\n}\n.l7-touch .l7-control-attribution,\n.l7-touch .l7-control-layers,\n.l7-touch .l7-bar {\n -webkit-box-shadow: none;\n box-shadow: none;\n}\n.l7-touch .l7-control-layers,\n.l7-touch .l7-bar {\n background-clip: padding-box;\n border: 2px solid rgba(0, 0, 0, 0.2);\n}\n.mapboxgl-ctrl-logo,\n.amap-logo {\n display: none !important;\n}\n.l7-select-box {\n border: 3px dashed gray;\n border-radius: 2px;\n position: absolute;\n z-index: 1000;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n.l7-control-container {\n font: 12px/1.5 'Helvetica Neue', Arial, Helvetica, sans-serif;\n}\n.l7-control-container .l7-control {\n position: relative;\n z-index: 800;\n float: left;\n clear: both;\n color: #595959;\n font-size: 12px;\n pointer-events: visiblePainted;\n /* IE 9-10 doesn't have auto */\n pointer-events: auto;\n}\n.l7-control-container .l7-control.l7-control--hide {\n display: none;\n}\n.l7-control-container .l7-top {\n top: 0;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n z-index: 1000;\n pointer-events: none;\n}\n.l7-control-container .l7-top .l7-control:not(.l7-control--hide) {\n margin-top: 8px;\n}\n.l7-control-container .l7-right {\n right: 0;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n z-index: 1000;\n pointer-events: none;\n}\n.l7-control-container .l7-right .l7-control:not(.l7-control--hide) {\n margin-right: 8px;\n}\n.l7-control-container .l7-bottom {\n bottom: 0;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n z-index: 1000;\n pointer-events: none;\n}\n.l7-control-container .l7-bottom .l7-control:not(.l7-control--hide) {\n margin-bottom: 8px;\n}\n.l7-control-container .l7-left {\n left: 0;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n position: absolute;\n z-index: 1000;\n pointer-events: none;\n}\n.l7-control-container .l7-left .l7-control:not(.l7-control--hide) {\n margin-left: 8px;\n}\n.l7-control-container .l7-center {\n position: absolute;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n}\n.l7-control-container .l7-center.l7-top,\n.l7-control-container .l7-center.l7-bottom {\n width: 100%;\n}\n.l7-control-container .l7-center.l7-left,\n.l7-control-container .l7-center.l7-right {\n height: 100%;\n}\n.l7-control-container .l7-center .l7-control {\n margin-right: 8px;\n margin-bottom: 8px;\n}\n.l7-control-container .l7-row {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n}\n.l7-control-container .l7-row.l7-top {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n}\n.l7-control-container .l7-row.l7-bottom {\n -webkit-box-align: end;\n -ms-flex-align: end;\n align-items: flex-end;\n}\n.l7-control-container .l7-column {\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n.l7-control-container .l7-column.l7-left {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n}\n.l7-control-container .l7-column.l7-right {\n -webkit-box-align: end;\n -ms-flex-align: end;\n align-items: flex-end;\n}\n.l7-button-control {\n min-width: 28px;\n height: 28px;\n background-color: #fff;\n border-width: 0;\n border-radius: 2px;\n outline: 0;\n cursor: pointer;\n -webkit-transition: all 0.2s;\n transition: all 0.2s;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n padding: 0 6px;\n -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n line-height: 16px;\n}\n.l7-button-control .l7-iconfont {\n fill: #595959;\n color: #595959;\n width: 16px;\n height: 16px;\n}\n.l7-button-control.l7-button-control--row {\n padding: 0 16px 0 13px;\n}\n.l7-button-control.l7-button-control--row * + .l7-button-control__text {\n margin-left: 8px;\n}\n.l7-button-control.l7-button-control--column {\n height: 44px;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n.l7-button-control.l7-button-control--column .l7-iconfont {\n margin-top: 3px;\n}\n.l7-button-control.l7-button-control--column .l7-button-control__text {\n margin-top: 3px;\n font-size: 10px;\n -webkit-transform: scale(0.83333);\n transform: scale(0.83333);\n}\n.l7-button-control:not(:disabled):hover {\n background-color: #f3f3f3;\n}\n.l7-button-control:not(:disabled):active {\n background-color: #f3f3f3;\n}\n.l7-button-control:disabled {\n background-color: #fafafa;\n color: #bdbdbd;\n cursor: not-allowed;\n}\n.l7-button-control:disabled .l7-iconfont {\n fill: #bdbdbd;\n color: #bdbdbd;\n}\n.l7-button-control:disabled:hover {\n background-color: #fafafa;\n}\n.l7-button-control:disabled:active {\n background-color: #fafafa;\n}\n.l7-popper {\n position: absolute;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n z-index: 5;\n color: #595959;\n}\n.l7-popper.l7-popper-hide {\n display: none;\n}\n.l7-popper .l7-popper-content {\n min-height: 28px;\n background: #fff;\n border-radius: 2px;\n -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n}\n.l7-popper .l7-popper-arrow {\n width: 0;\n height: 0;\n border-width: 4px;\n border-style: solid;\n border-top-color: transparent;\n border-bottom-color: transparent;\n border-left-color: transparent;\n border-right-color: transparent;\n -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n}\n.l7-popper.l7-popper-left {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n}\n.l7-popper.l7-popper-left .l7-popper-arrow {\n border-left-color: #fff;\n margin: 10px 0;\n}\n.l7-popper.l7-popper-right {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: reverse;\n -ms-flex-direction: row-reverse;\n flex-direction: row-reverse;\n}\n.l7-popper.l7-popper-right .l7-popper-arrow {\n border-right-color: #fff;\n margin: 10px 0;\n}\n.l7-popper.l7-popper-top {\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n.l7-popper.l7-popper-top .l7-popper-arrow {\n border-top-color: #fff;\n margin: 0 10px;\n}\n.l7-popper.l7-popper-bottom {\n -webkit-box-orient: vertical;\n -webkit-box-direction: reverse;\n -ms-flex-direction: column-reverse;\n flex-direction: column-reverse;\n}\n.l7-popper.l7-popper-bottom .l7-popper-arrow {\n border-bottom-color: #fff;\n margin: 0 10px;\n}\n.l7-popper.l7-popper-start {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n}\n.l7-popper.l7-popper-end {\n -webkit-box-align: end;\n -ms-flex-align: end;\n align-items: flex-end;\n}\n.l7-select-control--normal {\n padding: 4px 0;\n}\n.l7-select-control--normal .l7-select-control-item {\n height: 24px;\n line-height: 24px;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n padding: 0 16px;\n font-size: 12px;\n}\n.l7-select-control--normal .l7-select-control-item > * + * {\n margin-left: 6px;\n}\n.l7-select-control--normal .l7-select-control-item input[type='checkbox'] {\n height: 14px;\n width: 14px;\n}\n.l7-select-control--normal .l7-select-control-item:hover {\n background-color: #f3f3f3;\n}\n.l7-select-control--image {\n padding: 12px 12px 0 12px;\n width: 474px;\n height: 320px;\n overflow: auto;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -ms-flex-wrap: wrap;\n flex-wrap: wrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n}\n.l7-select-control--image .l7-select-control-item {\n margin-right: 12px;\n border-radius: 2px;\n overflow: hidden;\n border: 1px solid #fff;\n -webkit-box-sizing: content-box;\n box-sizing: content-box;\n width: calc((100% - 36px) / 3);\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n margin-bottom: 12px;\n position: relative;\n font-size: 12px;\n}\n.l7-select-control--image .l7-select-control-item img {\n width: 142px;\n height: 80px;\n}\n.l7-select-control--image .l7-select-control-item input[type='checkbox'] {\n position: absolute;\n right: 0;\n top: 0;\n}\n.l7-select-control--image .l7-select-control-item .l7-select-control-item-row {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-pack: center;\n -ms-flex-pack: center;\n justify-content: center;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n line-height: 26px;\n}\n.l7-select-control--image .l7-select-control-item .l7-select-control-item-row > * + * {\n margin-left: 8px;\n}\n.l7-select-control--image .l7-select-control-item.l7-select-control-item-active {\n border-color: #0370fe;\n}\n.l7-select-control--image .l7-select-control-item:nth-child(3n) {\n margin-right: 0;\n}\n.l7-select-control-item {\n cursor: pointer;\n}\n.l7-select-control-item input[type='checkbox'] {\n margin: 0;\n cursor: pointer;\n}\n.l7-select-control--multiple .l7-select-control-item:hover {\n background-color: transparent;\n}\n.l7-control-logo {\n width: 89px;\n height: 16px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n}\n.l7-control-logo img {\n height: 100%;\n width: 100%;\n}\n.l7-control-logo .l7-control-logo-link {\n display: block;\n cursor: pointer;\n}\n.l7-control-logo .l7-control-logo-link img {\n cursor: pointer;\n}\n.l7-control-mouse-location {\n background-color: #fff;\n border-radius: 2px;\n -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n padding: 2px 4px;\n min-width: 130px;\n}\n.l7-control-zoom {\n -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.15);\n border-radius: 2px;\n overflow: hidden;\n}\n.l7-control-zoom .l7-button-control {\n -webkit-box-shadow: 0 0 0;\n box-shadow: 0 0 0;\n border-radius: 0;\n font-size: 16px;\n}\n.l7-control-zoom .l7-button-control .l7-iconfont {\n width: 14px;\n height: 14px;\n}\n.l7-control-zoom .l7-button-control:first-child {\n border-bottom: 1px solid #f0f0f0;\n}\n.l7-control-scale {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n.l7-control-scale .l7-control-scale-line {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 2px 5px 1px;\n overflow: hidden;\n color: #595959;\n font-size: 10px;\n line-height: 1.1;\n white-space: nowrap;\n background: #fff;\n border: 2px solid #000;\n border-top: 0;\n -webkit-transition: width 0.1s;\n transition: width 0.1s;\n}\n.l7-control-scale .l7-control-scale-line + .l7-control-scale .l7-control-scale-line {\n margin-top: -2px;\n border-top: 2px solid #777;\n border-bottom: none;\n}\n.l7-right .l7-control-scale {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: end;\n -ms-flex-align: end;\n align-items: flex-end;\n}\n.l7-right .l7-control-scale .l7-control-scale-line {\n text-align: right;\n}\n.l7-popup {\n position: absolute;\n top: 0;\n left: 0;\n z-index: 5;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n will-change: transform;\n pointer-events: none;\n}\n.l7-popup.l7-popup-hide {\n display: none;\n}\n.l7-popup .l7-popup-content {\n position: relative;\n padding: 16px;\n font-size: 14px;\n background: #fff;\n border-radius: 3px;\n -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);\n}\n.l7-popup .l7-popup-content .l7-popup-content__title {\n margin-bottom: 8px;\n font-weight: bold;\n}\n.l7-popup .l7-popup-content .l7-popup-close-button,\n.l7-popup .l7-popup-content .l7-popup-content__title,\n.l7-popup .l7-popup-content .l7-popup-content__panel {\n white-space: normal;\n -webkit-user-select: text;\n -moz-user-select: text;\n -ms-user-select: text;\n user-select: text;\n pointer-events: initial;\n}\n.l7-popup .l7-popup-content .l7-popup-close-button {\n position: absolute;\n top: 0;\n right: 0;\n width: 18px;\n height: 18px;\n padding: 0;\n font-size: 14px;\n line-height: 18px;\n text-align: center;\n background-color: transparent;\n border: 0;\n border-radius: 0 3px 0 0;\n cursor: pointer;\n}\n.l7-popup .l7-popup-tip {\n position: relative;\n z-index: 1;\n width: 0;\n height: 0;\n border: 10px solid transparent;\n}\n.l7-popup.l7-popup-anchor-bottom,\n.l7-popup.l7-popup-anchor-bottom-left,\n.l7-popup.l7-popup-anchor-bottom-right {\n -webkit-box-orient: vertical;\n -webkit-box-direction: reverse;\n -ms-flex-direction: column-reverse;\n flex-direction: column-reverse;\n}\n.l7-popup.l7-popup-anchor-bottom .l7-popup-tip,\n.l7-popup.l7-popup-anchor-bottom-left .l7-popup-tip,\n.l7-popup.l7-popup-anchor-bottom-right .l7-popup-tip {\n bottom: 1px;\n}\n.l7-popup.l7-popup-anchor-top,\n.l7-popup.l7-popup-anchor-top-left,\n.l7-popup.l7-popup-anchor-top-right {\n -webkit-box-orient: vertical;\n -webkit-box-direction: normal;\n -ms-flex-direction: column;\n flex-direction: column;\n}\n.l7-popup.l7-popup-anchor-top .l7-popup-tip,\n.l7-popup.l7-popup-anchor-top-left .l7-popup-tip,\n.l7-popup.l7-popup-anchor-top-right .l7-popup-tip {\n top: 1px;\n}\n.l7-popup.l7-popup-anchor-left {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: normal;\n -ms-flex-direction: row;\n flex-direction: row;\n}\n.l7-popup.l7-popup-anchor-right {\n -webkit-box-orient: horizontal;\n -webkit-box-direction: reverse;\n -ms-flex-direction: row-reverse;\n flex-direction: row-reverse;\n}\n.l7-popup-anchor-top .l7-popup-tip {\n position: relative;\n -webkit-align-self: center;\n -ms-flex-item-align: center;\n align-self: center;\n border-top: none;\n border-bottom-color: #fff;\n}\n.l7-popup-anchor-top-left .l7-popup-tip {\n -webkit-align-self: flex-start;\n -ms-flex-item-align: start;\n align-self: flex-start;\n border-top: none;\n border-bottom-color: #fff;\n border-left: none;\n}\n.l7-popup-anchor-top-right .l7-popup-tip {\n -webkit-align-self: flex-end;\n -ms-flex-item-align: end;\n align-self: flex-end;\n border-top: none;\n border-right: none;\n border-bottom-color: #fff;\n}\n.l7-popup-anchor-bottom .l7-popup-tip {\n -webkit-align-self: center;\n -ms-flex-item-align: center;\n align-self: center;\n border-top-color: #fff;\n border-bottom: none;\n}\n.l7-popup-anchor-bottom-left .l7-popup-tip {\n -webkit-align-self: flex-start;\n -ms-flex-item-align: start;\n align-self: flex-start;\n border-top-color: #fff;\n border-bottom: none;\n border-left: none;\n}\n.l7-popup-anchor-bottom-right .l7-popup-tip {\n -webkit-align-self: flex-end;\n -ms-flex-item-align: end;\n align-self: flex-end;\n border-top-color: #fff;\n border-right: none;\n border-bottom: none;\n}\n.l7-popup-anchor-left .l7-popup-tip {\n -webkit-align-self: center;\n -ms-flex-item-align: center;\n align-self: center;\n border-right-color: #fff;\n border-left: none;\n}\n.l7-popup-anchor-right .l7-popup-tip {\n right: 1px;\n -webkit-align-self: center;\n -ms-flex-item-align: center;\n align-self: center;\n border-right: none;\n border-left-color: #fff;\n}\n.l7-popup-anchor-top-left .l7-popup-content {\n border-top-left-radius: 0;\n}\n.l7-popup-anchor-top-right .l7-popup-content {\n border-top-right-radius: 0;\n}\n.l7-popup-anchor-bottom-left .l7-popup-content {\n border-bottom-left-radius: 0;\n}\n.l7-popup-anchor-bottom-right .l7-popup-content {\n border-bottom-right-radius: 0;\n}\n.l7-popup-track-pointer {\n display: none;\n}\n.l7-popup-track-pointer * {\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n pointer-events: none;\n}\n.l7-map:hover .l7-popup-track-pointer {\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n}\n.l7-map:active .l7-popup-track-pointer {\n display: none;\n}\n.l7-layer-popup__row {\n font-size: 12px;\n}\n.l7-layer-popup__row + .l7-layer-popup__row {\n margin-top: 4px;\n}\n");
|
package/lib/marker-layer.js
CHANGED
|
@@ -1,32 +1,54 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
|
|
4
5
|
Object.defineProperty(exports, "__esModule", {
|
|
5
6
|
value: true
|
|
6
7
|
});
|
|
7
8
|
exports.default = void 0;
|
|
9
|
+
|
|
8
10
|
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
|
|
11
|
+
|
|
9
12
|
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
|
|
13
|
+
|
|
10
14
|
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
|
|
15
|
+
|
|
11
16
|
var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
|
|
17
|
+
|
|
12
18
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
19
|
+
|
|
13
20
|
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
|
|
21
|
+
|
|
14
22
|
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
|
|
23
|
+
|
|
15
24
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
25
|
+
|
|
16
26
|
var _l7Core = require("@antv/l7-core");
|
|
27
|
+
|
|
17
28
|
var _l7Utils = require("@antv/l7-utils");
|
|
29
|
+
|
|
18
30
|
var _eventemitter = require("eventemitter3");
|
|
31
|
+
|
|
19
32
|
var _lodash = require("lodash");
|
|
33
|
+
|
|
20
34
|
var _supercluster = _interopRequireDefault(require("supercluster/dist/supercluster"));
|
|
35
|
+
|
|
21
36
|
var _marker = _interopRequireDefault(require("./marker"));
|
|
37
|
+
|
|
22
38
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
|
|
39
|
+
|
|
23
40
|
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
|
|
41
|
+
|
|
24
42
|
var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
25
43
|
(0, _inherits2.default)(MarkerLayer, _EventEmitter);
|
|
44
|
+
|
|
26
45
|
var _super = _createSuper(MarkerLayer);
|
|
46
|
+
|
|
27
47
|
function MarkerLayer(option) {
|
|
28
48
|
var _this$markerLayerOpti;
|
|
49
|
+
|
|
29
50
|
var _this;
|
|
51
|
+
|
|
30
52
|
(0, _classCallCheck2.default)(this, MarkerLayer);
|
|
31
53
|
_this = _super.call(this);
|
|
32
54
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "markers", []);
|
|
@@ -37,6 +59,7 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
37
59
|
_this.zoom = ((_this$markerLayerOpti = _this.markerLayerOption.clusterOption) === null || _this$markerLayerOpti === void 0 ? void 0 : _this$markerLayerOpti.zoom) || -99;
|
|
38
60
|
return _this;
|
|
39
61
|
}
|
|
62
|
+
|
|
40
63
|
(0, _createClass2.default)(MarkerLayer, [{
|
|
41
64
|
key: "getDefault",
|
|
42
65
|
value: function getDefault() {
|
|
@@ -51,60 +74,63 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
51
74
|
className: ''
|
|
52
75
|
}
|
|
53
76
|
};
|
|
54
|
-
}
|
|
77
|
+
} // 执行scene.addMarkerLayer时调用
|
|
55
78
|
|
|
56
|
-
// 执行scene.addMarkerLayer时调用
|
|
57
79
|
}, {
|
|
58
80
|
key: "addTo",
|
|
59
81
|
value: function addTo(scene) {
|
|
60
82
|
// this.remove();
|
|
61
83
|
this.scene = scene;
|
|
62
84
|
this.mapsService = scene.get(_l7Core.TYPES.IMapService);
|
|
85
|
+
|
|
63
86
|
if (this.markerLayerOption.cluster) {
|
|
64
87
|
this.initCluster();
|
|
65
|
-
this.update();
|
|
66
|
-
|
|
88
|
+
this.update(); // 地图视野变化时,重新计算视野内的聚合点。
|
|
89
|
+
|
|
67
90
|
this.mapsService.on('camerachange', this.update); // amap1.x 更新事件
|
|
91
|
+
|
|
68
92
|
this.mapsService.on('viewchange', this.update); // amap2.0 更新事件
|
|
69
93
|
}
|
|
70
94
|
|
|
71
95
|
this.mapsService.on('camerachange', this.setContainerSize.bind(this)); // amap1.x 更新事件
|
|
96
|
+
|
|
72
97
|
this.mapsService.on('viewchange', this.setContainerSize.bind(this)); // amap2.0 更新事件
|
|
98
|
+
|
|
73
99
|
this.addMarkers();
|
|
74
100
|
this.inited = true;
|
|
75
101
|
return this;
|
|
76
|
-
}
|
|
102
|
+
} // 设置容器大小
|
|
77
103
|
|
|
78
|
-
// 设置容器大小
|
|
79
104
|
}, {
|
|
80
105
|
key: "setContainerSize",
|
|
81
106
|
value: function setContainerSize() {
|
|
82
107
|
if (!this.mapsService) {
|
|
83
108
|
return;
|
|
84
109
|
}
|
|
110
|
+
|
|
85
111
|
var container = this.mapsService.getContainer();
|
|
86
112
|
this.containerSize = {
|
|
87
113
|
containerWidth: (container === null || container === void 0 ? void 0 : container.scrollWidth) || 0,
|
|
88
114
|
containerHeight: (container === null || container === void 0 ? void 0 : container.scrollHeight) || 0,
|
|
89
115
|
bounds: this.mapsService.getBounds()
|
|
90
116
|
};
|
|
91
|
-
}
|
|
117
|
+
} // 获取容器尺寸
|
|
92
118
|
|
|
93
|
-
// 获取容器尺寸
|
|
94
119
|
}, {
|
|
95
120
|
key: "getContainerSize",
|
|
96
121
|
value: function getContainerSize() {
|
|
97
122
|
return this.containerSize;
|
|
98
|
-
}
|
|
123
|
+
} // 在图层添加单个marker
|
|
99
124
|
|
|
100
|
-
// 在图层添加单个marker
|
|
101
125
|
}, {
|
|
102
126
|
key: "addMarker",
|
|
103
127
|
value: function addMarker(marker) {
|
|
104
128
|
var cluster = this.markerLayerOption.cluster;
|
|
105
129
|
marker.getMarkerLayerContainerSize = this.getContainerSize.bind(this);
|
|
130
|
+
|
|
106
131
|
if (cluster) {
|
|
107
132
|
this.addPoint(marker, this.markers.length);
|
|
133
|
+
|
|
108
134
|
if (this.mapsService) {
|
|
109
135
|
// 在新增 marker 的时候需要更新聚合信息(哪怕此时的 zoom 没有发生变化)
|
|
110
136
|
var zoom = this.mapsService.getZoom();
|
|
@@ -114,8 +140,8 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
114
140
|
this.getClusterMarker(this.bbox, this.zoom);
|
|
115
141
|
}
|
|
116
142
|
}
|
|
117
|
-
|
|
118
|
-
// if(this.inited) {
|
|
143
|
+
|
|
144
|
+
this.markers.push(marker); // if(this.inited) {
|
|
119
145
|
// marker.addTo(this.scene);
|
|
120
146
|
// }
|
|
121
147
|
}
|
|
@@ -124,14 +150,15 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
124
150
|
value: function removeMarker(marker) {
|
|
125
151
|
this.markers.indexOf(marker);
|
|
126
152
|
var markerIndex = this.markers.indexOf(marker);
|
|
153
|
+
|
|
127
154
|
if (markerIndex > -1) {
|
|
128
155
|
this.markers.splice(markerIndex, 1);
|
|
129
156
|
}
|
|
130
157
|
}
|
|
131
|
-
|
|
132
158
|
/**
|
|
133
159
|
* 隐藏 marker 在每个 marker 上单独修改属性而不是在 markerContainer 上修改(在 markerContainer 修改会有用户在场景加载完之前调用失败的问题)
|
|
134
160
|
*/
|
|
161
|
+
|
|
135
162
|
}, {
|
|
136
163
|
key: "hide",
|
|
137
164
|
value: function hide() {
|
|
@@ -142,10 +169,10 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
142
169
|
m.getElement().style.opacity = '0';
|
|
143
170
|
});
|
|
144
171
|
}
|
|
145
|
-
|
|
146
172
|
/**
|
|
147
173
|
* 显示 marker
|
|
148
174
|
*/
|
|
175
|
+
|
|
149
176
|
}, {
|
|
150
177
|
key: "show",
|
|
151
178
|
value: function show() {
|
|
@@ -155,27 +182,25 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
155
182
|
this.clusterMarkers.map(function (m) {
|
|
156
183
|
m.getElement().style.opacity = '1';
|
|
157
184
|
});
|
|
158
|
-
}
|
|
185
|
+
} // 返回当下的markers数据,有聚合图时返回聚合的marker列表,否则返回原始maerker列表
|
|
159
186
|
|
|
160
|
-
// 返回当下的markers数据,有聚合图时返回聚合的marker列表,否则返回原始maerker列表
|
|
161
187
|
}, {
|
|
162
188
|
key: "getMarkers",
|
|
163
189
|
value: function getMarkers() {
|
|
164
190
|
var cluster = this.markerLayerOption.cluster;
|
|
165
191
|
return cluster ? this.clusterMarkers : this.markers;
|
|
166
|
-
}
|
|
192
|
+
} // 批量添加marker到scene
|
|
167
193
|
|
|
168
|
-
// 批量添加marker到scene
|
|
169
194
|
}, {
|
|
170
195
|
key: "addMarkers",
|
|
171
196
|
value: function addMarkers() {
|
|
172
197
|
var _this2 = this;
|
|
198
|
+
|
|
173
199
|
this.getMarkers().forEach(function (marker) {
|
|
174
200
|
marker.addTo(_this2.scene);
|
|
175
201
|
});
|
|
176
|
-
}
|
|
202
|
+
} // 清除图层里的marker
|
|
177
203
|
|
|
178
|
-
// 清除图层里的marker
|
|
179
204
|
}, {
|
|
180
205
|
key: "clear",
|
|
181
206
|
value: function clear() {
|
|
@@ -198,15 +223,15 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
198
223
|
this.mapsService.off('viewchange', this.update);
|
|
199
224
|
this.mapsService.off('camerachange', this.setContainerSize.bind(this));
|
|
200
225
|
this.mapsService.off('viewchange', this.setContainerSize.bind(this));
|
|
201
|
-
}
|
|
226
|
+
} // 将marker数据保存在point中
|
|
202
227
|
|
|
203
|
-
// 将marker数据保存在point中
|
|
204
228
|
}, {
|
|
205
229
|
key: "addPoint",
|
|
206
230
|
value: function addPoint(marker, id) {
|
|
207
231
|
var _marker$getLnglat = marker.getLnglat(),
|
|
208
|
-
|
|
209
|
-
|
|
232
|
+
lng = _marker$getLnglat.lng,
|
|
233
|
+
lat = _marker$getLnglat.lat;
|
|
234
|
+
|
|
210
235
|
var feature = {
|
|
211
236
|
geometry: {
|
|
212
237
|
type: 'Point',
|
|
@@ -217,6 +242,7 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
217
242
|
})
|
|
218
243
|
};
|
|
219
244
|
this.points.push(feature);
|
|
245
|
+
|
|
220
246
|
if (this.clusterIndex) {
|
|
221
247
|
// 在新增点的时候需要更新 cluster 的数据
|
|
222
248
|
this.clusterIndex.load(this.points);
|
|
@@ -228,23 +254,25 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
228
254
|
if (!this.markerLayerOption.cluster) {
|
|
229
255
|
return;
|
|
230
256
|
}
|
|
257
|
+
|
|
231
258
|
var _this$markerLayerOpti2 = this.markerLayerOption.clusterOption,
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
259
|
+
radius = _this$markerLayerOpti2.radius,
|
|
260
|
+
_this$markerLayerOpti3 = _this$markerLayerOpti2.minZoom,
|
|
261
|
+
minZoom = _this$markerLayerOpti3 === void 0 ? 0 : _this$markerLayerOpti3,
|
|
262
|
+
maxZoom = _this$markerLayerOpti2.maxZoom;
|
|
236
263
|
this.clusterIndex = new _supercluster.default({
|
|
237
264
|
radius: radius,
|
|
238
265
|
minZoom: minZoom,
|
|
239
266
|
maxZoom: maxZoom
|
|
240
|
-
});
|
|
241
|
-
|
|
267
|
+
}); // @ts-ignore
|
|
268
|
+
|
|
242
269
|
this.clusterIndex.load(this.points);
|
|
243
270
|
}
|
|
244
271
|
}, {
|
|
245
272
|
key: "getClusterMarker",
|
|
246
273
|
value: function getClusterMarker(viewBounds, zoom) {
|
|
247
274
|
var _this3 = this;
|
|
275
|
+
|
|
248
276
|
var viewBBox = viewBounds[0].concat(viewBounds[1]);
|
|
249
277
|
var clusterPoint = this.clusterIndex.getClusters(viewBBox, zoom);
|
|
250
278
|
this.clusterMarkers.forEach(function (marker) {
|
|
@@ -253,27 +281,37 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
253
281
|
this.clusterMarkers = [];
|
|
254
282
|
clusterPoint.forEach(function (feature) {
|
|
255
283
|
var _feature$properties;
|
|
284
|
+
|
|
256
285
|
var _this3$markerLayerOpt = _this3.markerLayerOption.clusterOption,
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
286
|
+
field = _this3$markerLayerOpt.field,
|
|
287
|
+
method = _this3$markerLayerOpt.method; // 处理聚合数据
|
|
288
|
+
|
|
260
289
|
if ((_feature$properties = feature.properties) !== null && _feature$properties !== void 0 && _feature$properties.cluster_id) {
|
|
261
290
|
var _feature$properties2;
|
|
291
|
+
|
|
262
292
|
var clusterData = _this3.getLeaves((_feature$properties2 = feature.properties) === null || _feature$properties2 === void 0 ? void 0 : _feature$properties2.cluster_id);
|
|
293
|
+
|
|
263
294
|
feature.properties.clusterData = clusterData;
|
|
295
|
+
|
|
264
296
|
if (field && method) {
|
|
265
297
|
var columnData = clusterData === null || clusterData === void 0 ? void 0 : clusterData.map(function (item) {
|
|
266
298
|
var data = (0, _defineProperty2.default)({}, field, item.properties[field]);
|
|
267
299
|
return data;
|
|
268
300
|
});
|
|
301
|
+
|
|
269
302
|
var column = _l7Utils.Satistics.getColumn(columnData, field);
|
|
303
|
+
|
|
270
304
|
var stat = _l7Utils.Satistics.getSatByColumn(method, column);
|
|
305
|
+
|
|
271
306
|
var fieldName = 'point_' + method;
|
|
272
307
|
feature.properties[fieldName] = stat.toFixed(2);
|
|
273
308
|
}
|
|
274
309
|
}
|
|
310
|
+
|
|
275
311
|
var marker = _this3.clusterMarker(feature);
|
|
312
|
+
|
|
276
313
|
_this3.clusterMarkers.push(marker);
|
|
314
|
+
|
|
277
315
|
marker.addTo(_this3.scene);
|
|
278
316
|
});
|
|
279
317
|
}
|
|
@@ -282,9 +320,11 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
282
320
|
value: function getLeaves(clusterId) {
|
|
283
321
|
var limit = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : Infinity;
|
|
284
322
|
var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
|
|
323
|
+
|
|
285
324
|
if (!clusterId) {
|
|
286
325
|
return null;
|
|
287
326
|
}
|
|
327
|
+
|
|
288
328
|
return this.clusterIndex.getLeaves(clusterId, limit, offset);
|
|
289
329
|
}
|
|
290
330
|
}, {
|
|
@@ -292,8 +332,8 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
292
332
|
value: function clusterMarker(feature) {
|
|
293
333
|
var clusterOption = this.markerLayerOption.clusterOption;
|
|
294
334
|
var _ref = clusterOption,
|
|
295
|
-
|
|
296
|
-
|
|
335
|
+
_ref$element = _ref.element,
|
|
336
|
+
element = _ref$element === void 0 ? this.generateElement.bind(this) : _ref$element;
|
|
297
337
|
var marker = new _marker.default({
|
|
298
338
|
element: element(feature)
|
|
299
339
|
}).setLnglat({
|
|
@@ -313,13 +353,16 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
313
353
|
value: function update() {
|
|
314
354
|
if (!this.mapsService) {
|
|
315
355
|
return;
|
|
316
|
-
}
|
|
317
|
-
|
|
356
|
+
} // 当图层中无marker时,无需更新
|
|
357
|
+
|
|
358
|
+
|
|
318
359
|
if (this.markers.length === 0) {
|
|
319
360
|
return;
|
|
320
361
|
}
|
|
362
|
+
|
|
321
363
|
var zoom = this.mapsService.getZoom();
|
|
322
364
|
var bbox = this.mapsService.getBounds();
|
|
365
|
+
|
|
323
366
|
if (!this.bbox || Math.abs(zoom - this.zoom) >= 1 || !(0, _l7Utils.boundsContains)(this.bbox, bbox)) {
|
|
324
367
|
this.bbox = (0, _l7Utils.padBounds)(bbox, 0.5);
|
|
325
368
|
this.zoom = Math.floor(zoom);
|
|
@@ -330,11 +373,14 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
330
373
|
key: "generateElement",
|
|
331
374
|
value: function generateElement(feature) {
|
|
332
375
|
var el = _l7Utils.DOM.create('div', 'l7-marker-cluster');
|
|
376
|
+
|
|
333
377
|
var label = _l7Utils.DOM.create('div', '', el);
|
|
378
|
+
|
|
334
379
|
var span = _l7Utils.DOM.create('span', '', label);
|
|
380
|
+
|
|
335
381
|
var _this$markerLayerOpti4 = this.markerLayerOption.clusterOption,
|
|
336
|
-
|
|
337
|
-
|
|
382
|
+
field = _this$markerLayerOpti4.field,
|
|
383
|
+
method = _this$markerLayerOpti4.method;
|
|
338
384
|
feature.properties.point_count = feature.properties.point_count || 1;
|
|
339
385
|
var text = field && method ? feature.properties['point_' + method] || feature.properties[field] : feature.properties.point_count;
|
|
340
386
|
span.textContent = text;
|
|
@@ -343,4 +389,5 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
|
|
|
343
389
|
}]);
|
|
344
390
|
return MarkerLayer;
|
|
345
391
|
}(_eventemitter.EventEmitter);
|
|
392
|
+
|
|
346
393
|
exports.default = MarkerLayer;
|