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