@antv/l7-component 2.17.4 → 2.17.5
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 +10 -17
- package/es/control/baseControl/buttonControl.js +9 -42
- package/es/control/baseControl/control.js +24 -53
- package/es/control/baseControl/popperControl.js +10 -24
- package/es/control/baseControl/selectControl.js +6 -45
- package/es/control/exportImage.js +76 -116
- package/es/control/fullscreen.js +20 -53
- package/es/control/geoLocate.js +36 -66
- package/es/control/layerSwitch.js +0 -31
- package/es/control/logo.js +2 -14
- package/es/control/mapTheme.js +7 -32
- package/es/control/mouseLocation.js +2 -23
- package/es/control/scale.js +6 -29
- package/es/control/zoom.js +0 -23
- package/es/index.js +2 -12
- package/es/marker-layer.js +41 -75
- package/es/marker.js +29 -83
- package/es/popup/layerPopup.js +31 -82
- package/es/popup/popup.js +48 -127
- package/es/utils/anchor.js +3 -7
- package/es/utils/popper.js +15 -64
- package/es/utils/screenfull.js +23 -52
- package/lib/assets/iconfont/iconfont.js +10 -17
- package/lib/control/baseControl/buttonControl.js +9 -52
- package/lib/control/baseControl/control.js +24 -68
- package/lib/control/baseControl/index.js +0 -4
- package/lib/control/baseControl/popperControl.js +10 -29
- package/lib/control/baseControl/selectControl.js +6 -60
- package/lib/control/exportImage.js +76 -125
- package/lib/control/fullscreen.js +20 -60
- package/lib/control/geoLocate.js +36 -75
- package/lib/control/layerSwitch.js +0 -36
- package/lib/control/logo.js +2 -26
- package/lib/control/mapTheme.js +7 -42
- package/lib/control/mouseLocation.js +2 -33
- package/lib/control/scale.js +6 -40
- package/lib/control/zoom.js +0 -33
- package/lib/index.js +0 -30
- package/lib/marker-layer.js +39 -86
- package/lib/marker.js +29 -91
- package/lib/popup/layerPopup.js +29 -94
- package/lib/popup/popup.js +48 -139
- package/lib/utils/anchor.js +4 -9
- package/lib/utils/icon.js +0 -2
- package/lib/utils/popper.js +14 -71
- package/lib/utils/screenfull.js +23 -54
- package/package.json +6 -6
package/es/popup/layerPopup.js
CHANGED
|
@@ -7,53 +7,39 @@ import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
|
7
7
|
import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
|
|
8
8
|
import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
|
|
9
9
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
10
|
-
|
|
11
10
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
12
|
-
|
|
13
11
|
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; } }
|
|
14
|
-
|
|
15
12
|
import { DOM } from '@antv/l7-utils';
|
|
16
|
-
import { get } from 'lodash';
|
|
17
|
-
|
|
13
|
+
import { get } from 'lodash';
|
|
14
|
+
// import { Container } from 'inversify';
|
|
18
15
|
import Popup from "./popup";
|
|
19
16
|
export { LayerPopup };
|
|
20
|
-
|
|
21
17
|
var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
22
18
|
_inherits(LayerPopup, _Popup);
|
|
23
|
-
|
|
24
19
|
var _super = _createSuper(LayerPopup);
|
|
25
|
-
|
|
26
20
|
function LayerPopup() {
|
|
27
21
|
var _this;
|
|
28
|
-
|
|
29
22
|
_classCallCheck(this, LayerPopup);
|
|
30
|
-
|
|
31
23
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
32
24
|
args[_key] = arguments[_key];
|
|
33
25
|
}
|
|
34
|
-
|
|
35
26
|
_this = _super.call.apply(_super, [this].concat(args));
|
|
36
|
-
|
|
37
27
|
_defineProperty(_assertThisInitialized(_this), "layerConfigMap", new WeakMap());
|
|
38
|
-
|
|
39
28
|
return _this;
|
|
40
29
|
}
|
|
41
|
-
|
|
42
30
|
_createClass(LayerPopup, [{
|
|
43
31
|
key: "layerConfigItems",
|
|
44
32
|
get: function get() {
|
|
45
33
|
var _ref;
|
|
46
|
-
|
|
47
34
|
var _this$popupOption = this.popupOption,
|
|
48
|
-
|
|
49
|
-
|
|
35
|
+
config = _this$popupOption.config,
|
|
36
|
+
items = _this$popupOption.items;
|
|
50
37
|
return (_ref = config !== null && config !== void 0 ? config : items) !== null && _ref !== void 0 ? _ref : [];
|
|
51
38
|
}
|
|
52
39
|
}, {
|
|
53
40
|
key: "addTo",
|
|
54
41
|
value: function addTo(scene) {
|
|
55
42
|
_get(_getPrototypeOf(LayerPopup.prototype), "addTo", this).call(this, scene);
|
|
56
|
-
|
|
57
43
|
this.bindLayerEvent();
|
|
58
44
|
this.hide();
|
|
59
45
|
return this;
|
|
@@ -62,7 +48,6 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
62
48
|
key: "remove",
|
|
63
49
|
value: function remove() {
|
|
64
50
|
_get(_getPrototypeOf(LayerPopup.prototype), "remove", this).call(this);
|
|
65
|
-
|
|
66
51
|
this.unbindLayerEvent();
|
|
67
52
|
return this;
|
|
68
53
|
}
|
|
@@ -70,9 +55,7 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
70
55
|
key: "setOptions",
|
|
71
56
|
value: function setOptions(option) {
|
|
72
57
|
this.unbindLayerEvent();
|
|
73
|
-
|
|
74
58
|
_get(_getPrototypeOf(LayerPopup.prototype), "setOptions", this).call(this, option);
|
|
75
|
-
|
|
76
59
|
this.bindLayerEvent();
|
|
77
60
|
return this;
|
|
78
61
|
}
|
|
@@ -94,93 +77,72 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
94
77
|
closeOnEsc: false
|
|
95
78
|
});
|
|
96
79
|
}
|
|
80
|
+
|
|
97
81
|
/**
|
|
98
82
|
* 绑定对应的图层事件
|
|
99
83
|
* @protected
|
|
100
84
|
*/
|
|
101
|
-
|
|
102
85
|
}, {
|
|
103
86
|
key: "bindLayerEvent",
|
|
104
87
|
value: function bindLayerEvent() {
|
|
105
88
|
var _this2 = this;
|
|
106
|
-
|
|
107
89
|
var trigger = this.popupOption.trigger;
|
|
108
90
|
this.layerConfigItems.forEach(function (configItem) {
|
|
109
91
|
var _layer$getSource;
|
|
110
|
-
|
|
111
92
|
var layer = _this2.getLayerByConfig(configItem);
|
|
112
|
-
|
|
113
93
|
if (!layer) {
|
|
114
94
|
return;
|
|
115
95
|
}
|
|
116
|
-
|
|
117
96
|
var layerInfo = _objectSpread({}, configItem);
|
|
118
|
-
|
|
119
97
|
if (trigger === 'hover') {
|
|
120
98
|
var onMouseMove = _this2.onLayerMouseMove.bind(_this2, layer);
|
|
121
|
-
|
|
122
99
|
var onMouseOut = _this2.onLayerMouseOut.bind(_this2, layer);
|
|
123
|
-
|
|
124
100
|
layerInfo.onMouseMove = onMouseMove;
|
|
125
101
|
layerInfo.onMouseOut = onMouseOut;
|
|
126
102
|
layer === null || layer === void 0 ? void 0 : layer.on('mousemove', onMouseMove);
|
|
127
103
|
layer === null || layer === void 0 ? void 0 : layer.on('mouseout', onMouseOut);
|
|
128
104
|
} else {
|
|
129
105
|
var onClick = _this2.onLayerClick.bind(_this2, layer);
|
|
130
|
-
|
|
131
106
|
layerInfo.onClick = onClick;
|
|
132
107
|
layer === null || layer === void 0 ? void 0 : layer.on('click', onClick);
|
|
133
108
|
}
|
|
134
|
-
|
|
135
109
|
var source = layer === null || layer === void 0 ? void 0 : (_layer$getSource = layer.getSource) === null || _layer$getSource === void 0 ? void 0 : _layer$getSource.call(layer);
|
|
136
|
-
|
|
137
110
|
var onSourceUpdate = _this2.onSourceUpdate.bind(_this2, layer);
|
|
138
|
-
|
|
139
111
|
source === null || source === void 0 ? void 0 : source.on('update', onSourceUpdate);
|
|
140
112
|
layerInfo.onSourceUpdate = onSourceUpdate;
|
|
141
|
-
|
|
142
113
|
_this2.layerConfigMap.set(layer, layerInfo);
|
|
143
114
|
});
|
|
144
115
|
}
|
|
116
|
+
|
|
145
117
|
/**
|
|
146
118
|
* 解绑对应的图层事件
|
|
147
119
|
* @protected
|
|
148
120
|
*/
|
|
149
|
-
|
|
150
121
|
}, {
|
|
151
122
|
key: "unbindLayerEvent",
|
|
152
123
|
value: function unbindLayerEvent() {
|
|
153
124
|
var _this3 = this;
|
|
154
|
-
|
|
155
125
|
this.layerConfigItems.forEach(function (configItem) {
|
|
156
126
|
var layer = _this3.getLayerByConfig(configItem);
|
|
157
|
-
|
|
158
127
|
var layerInfo = layer && _this3.layerConfigMap.get(layer);
|
|
159
|
-
|
|
160
128
|
if (!layerInfo) {
|
|
161
129
|
return;
|
|
162
130
|
}
|
|
163
|
-
|
|
164
131
|
var onMouseMove = layerInfo.onMouseMove,
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
132
|
+
onMouseOut = layerInfo.onMouseOut,
|
|
133
|
+
onClick = layerInfo.onClick,
|
|
134
|
+
onSourceUpdate = layerInfo.onSourceUpdate;
|
|
169
135
|
if (onMouseMove) {
|
|
170
136
|
layer.off('mousemove', onMouseMove);
|
|
171
137
|
}
|
|
172
|
-
|
|
173
138
|
if (onMouseOut) {
|
|
174
139
|
layer.off('mouseout', onMouseOut);
|
|
175
140
|
}
|
|
176
|
-
|
|
177
141
|
if (onClick) {
|
|
178
142
|
layer.off('click', onClick);
|
|
179
143
|
}
|
|
180
|
-
|
|
181
144
|
if (onSourceUpdate) {
|
|
182
145
|
var _layer$getSource2;
|
|
183
|
-
|
|
184
146
|
layer === null || layer === void 0 ? void 0 : (_layer$getSource2 = layer.getSource()) === null || _layer$getSource2 === void 0 ? void 0 : _layer$getSource2.off('update', onSourceUpdate);
|
|
185
147
|
}
|
|
186
148
|
});
|
|
@@ -190,9 +152,8 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
190
152
|
value: function onLayerMouseMove(layer, e) {
|
|
191
153
|
if (!this.isSameFeature(layer, e.featureId)) {
|
|
192
154
|
var _this$getLayerInfoFra = this.getLayerInfoFrag(layer, e),
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
155
|
+
title = _this$getLayerInfoFra.title,
|
|
156
|
+
content = _this$getLayerInfoFra.content;
|
|
196
157
|
this.setDOMContent(content);
|
|
197
158
|
this.setTitle(title);
|
|
198
159
|
this.displayFeatureInfo = {
|
|
@@ -201,13 +162,13 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
201
162
|
};
|
|
202
163
|
this.show();
|
|
203
164
|
}
|
|
204
|
-
}
|
|
165
|
+
}
|
|
205
166
|
|
|
167
|
+
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
206
168
|
}, {
|
|
207
169
|
key: "onLayerMouseOut",
|
|
208
170
|
value: function onLayerMouseOut(layer, e) {
|
|
209
171
|
this.displayFeatureInfo = undefined;
|
|
210
|
-
|
|
211
172
|
if (this.isShow) {
|
|
212
173
|
this.hide();
|
|
213
174
|
}
|
|
@@ -219,9 +180,8 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
219
180
|
this.hide();
|
|
220
181
|
} else {
|
|
221
182
|
var _this$getLayerInfoFra2 = this.getLayerInfoFrag(layer, e),
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
183
|
+
title = _this$getLayerInfoFra2.title,
|
|
184
|
+
content = _this$getLayerInfoFra2.content;
|
|
225
185
|
this.setDOMContent(content);
|
|
226
186
|
this.setLnglat(e.lngLat);
|
|
227
187
|
this.setTitle(title);
|
|
@@ -238,53 +198,47 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
238
198
|
this.hide();
|
|
239
199
|
this.displayFeatureInfo = undefined;
|
|
240
200
|
}
|
|
201
|
+
|
|
241
202
|
/**
|
|
242
203
|
* 通过当前图层和对应选中的元素获取气泡展示的 HTML 内容
|
|
243
204
|
* @param layer
|
|
244
205
|
* @param e
|
|
245
206
|
* @protected
|
|
246
207
|
*/
|
|
247
|
-
|
|
248
208
|
}, {
|
|
249
209
|
key: "getLayerInfoFrag",
|
|
250
210
|
value: function getLayerInfoFrag(layer, e) {
|
|
251
211
|
var layerInfo = this.layerConfigMap.get(layer);
|
|
252
212
|
var titleFrag;
|
|
253
213
|
var contentFrag = document.createDocumentFragment();
|
|
254
|
-
|
|
255
214
|
if (layerInfo) {
|
|
256
215
|
var _feature = e.feature;
|
|
257
|
-
|
|
258
216
|
if (_feature.type === 'Feature' && 'properties' in _feature && 'geometry' in _feature) {
|
|
259
217
|
_feature = _feature.properties;
|
|
260
218
|
}
|
|
261
|
-
|
|
262
219
|
var title = layerInfo.title,
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
220
|
+
fields = layerInfo.fields,
|
|
221
|
+
customContent = layerInfo.customContent;
|
|
266
222
|
if (title) {
|
|
267
223
|
titleFrag = document.createDocumentFragment();
|
|
268
224
|
var titleElement = title instanceof Function ? title(_feature) : title;
|
|
269
225
|
DOM.appendElementType(titleFrag, titleElement);
|
|
270
226
|
}
|
|
271
|
-
|
|
272
227
|
if (customContent) {
|
|
273
228
|
var content = customContent instanceof Function ? customContent(_feature) : customContent;
|
|
274
229
|
DOM.appendElementType(contentFrag, content);
|
|
275
230
|
} else if (fields !== null && fields !== void 0 && fields.length) {
|
|
276
231
|
fields === null || fields === void 0 ? void 0 : fields.forEach(function (fieldConfig) {
|
|
277
232
|
var _ref3, _ref4;
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
233
|
+
var _ref2 = typeof fieldConfig === 'string' ?
|
|
234
|
+
// tslint:disable-next-line:no-object-literal-type-assertion
|
|
235
|
+
{
|
|
236
|
+
field: fieldConfig
|
|
237
|
+
} : fieldConfig,
|
|
238
|
+
field = _ref2.field,
|
|
239
|
+
formatField = _ref2.formatField,
|
|
240
|
+
formatValue = _ref2.formatValue,
|
|
241
|
+
getValue = _ref2.getValue;
|
|
288
242
|
var row = DOM.create('div', 'l7-layer-popup__row');
|
|
289
243
|
var value = getValue ? getValue(e.feature) : get(_feature, field);
|
|
290
244
|
var fieldElement = (_ref3 = formatField instanceof Function ? formatField(field, _feature) : formatField) !== null && _ref3 !== void 0 ? _ref3 : field;
|
|
@@ -292,8 +246,9 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
292
246
|
var fieldSpan = DOM.create('span', 'l7-layer-popup__key', row);
|
|
293
247
|
DOM.appendElementType(fieldSpan, fieldElement);
|
|
294
248
|
DOM.appendElementType(fieldSpan, document.createTextNode(':'));
|
|
295
|
-
var valueSpan = DOM.create('span', 'l7-layer-popup__value', row);
|
|
249
|
+
var valueSpan = DOM.create('span', 'l7-layer-popup__value', row);
|
|
296
250
|
|
|
251
|
+
// 当 value 中每项元素均为基础数据类型时,用逗号隔开
|
|
297
252
|
if (Array.isArray(valueElement) && valueElement.every(function (item) {
|
|
298
253
|
return !(item instanceof Object);
|
|
299
254
|
})) {
|
|
@@ -301,44 +256,40 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
301
256
|
return String(item);
|
|
302
257
|
}).join(',');
|
|
303
258
|
}
|
|
304
|
-
|
|
305
259
|
DOM.appendElementType(valueSpan, valueElement);
|
|
306
260
|
contentFrag.appendChild(row);
|
|
307
261
|
});
|
|
308
262
|
}
|
|
309
263
|
}
|
|
310
|
-
|
|
311
264
|
return {
|
|
312
265
|
title: titleFrag,
|
|
313
266
|
content: contentFrag
|
|
314
267
|
};
|
|
315
268
|
}
|
|
269
|
+
|
|
316
270
|
/**
|
|
317
271
|
* 通过 Layer 配置访问到真实的 Layer 实例
|
|
318
272
|
* @param configItem
|
|
319
273
|
* @protected
|
|
320
274
|
*/
|
|
321
|
-
|
|
322
275
|
}, {
|
|
323
276
|
key: "getLayerByConfig",
|
|
324
277
|
value: function getLayerByConfig(configItem) {
|
|
325
278
|
var layer = configItem.layer;
|
|
326
|
-
|
|
327
279
|
if (layer instanceof Object) {
|
|
328
280
|
return layer;
|
|
329
281
|
}
|
|
330
|
-
|
|
331
282
|
if (typeof layer === 'string') {
|
|
332
283
|
return this.layerService.getLayer(layer) || this.layerService.getLayerByName(layer);
|
|
333
284
|
}
|
|
334
285
|
}
|
|
286
|
+
|
|
335
287
|
/**
|
|
336
288
|
* 判断当前展示的 Feature 是否和上一次查看的一致
|
|
337
289
|
* @param layer
|
|
338
290
|
* @param featureId
|
|
339
291
|
* @protected
|
|
340
292
|
*/
|
|
341
|
-
|
|
342
293
|
}, {
|
|
343
294
|
key: "isSameFeature",
|
|
344
295
|
value: function isSameFeature(layer, featureId) {
|
|
@@ -346,8 +297,6 @@ var LayerPopup = /*#__PURE__*/function (_Popup) {
|
|
|
346
297
|
return displayFeatureInfo && layer === displayFeatureInfo.layer && featureId === displayFeatureInfo.featureId;
|
|
347
298
|
}
|
|
348
299
|
}]);
|
|
349
|
-
|
|
350
300
|
return LayerPopup;
|
|
351
301
|
}(Popup);
|
|
352
|
-
|
|
353
302
|
export { LayerPopup as default };
|