@antv/l7-component 2.21.0 → 2.21.2

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