@antv/l7-component 2.20.14 → 2.20.15
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/marker.d.ts +6 -1
- package/es/marker.js +68 -9
- package/lib/marker.js +68 -9
- package/package.json +6 -6
package/es/marker.d.ts
CHANGED
|
@@ -11,6 +11,7 @@ export default class Marker extends EventEmitter {
|
|
|
11
11
|
private lngLat;
|
|
12
12
|
private scene;
|
|
13
13
|
private added;
|
|
14
|
+
private preLngLat;
|
|
14
15
|
getMarkerLayerContainerSize(): IMarkerContainerAndBounds | void;
|
|
15
16
|
constructor(option?: Partial<IMarkerOption>);
|
|
16
17
|
getDefault(): {
|
|
@@ -33,12 +34,16 @@ export default class Marker extends EventEmitter {
|
|
|
33
34
|
getPopup(): IPopup;
|
|
34
35
|
getOffset(): number[];
|
|
35
36
|
setDraggable(draggable: boolean): void;
|
|
36
|
-
|
|
37
|
+
getDraggable(): boolean;
|
|
37
38
|
getExtData(): any;
|
|
38
39
|
setExtData(data: any): void;
|
|
39
40
|
private update;
|
|
40
41
|
private onMapClick;
|
|
41
42
|
private getCurrentContainerSize;
|
|
43
|
+
private updateDraggable;
|
|
44
|
+
private onMarkerDragStart;
|
|
45
|
+
private onMarkerDragMove;
|
|
46
|
+
private onMarkerDragEnd;
|
|
42
47
|
private updatePosition;
|
|
43
48
|
private init;
|
|
44
49
|
private registerMarkerEvent;
|
package/es/marker.js
CHANGED
|
@@ -20,6 +20,53 @@ var Marker = /*#__PURE__*/function (_EventEmitter) {
|
|
|
20
20
|
_classCallCheck(this, Marker);
|
|
21
21
|
_this = _super.call(this);
|
|
22
22
|
_defineProperty(_assertThisInitialized(_this), "added", false);
|
|
23
|
+
_defineProperty(_assertThisInitialized(_this), "preLngLat", {
|
|
24
|
+
lng: 0,
|
|
25
|
+
lat: 0
|
|
26
|
+
});
|
|
27
|
+
_defineProperty(_assertThisInitialized(_this), "onMarkerDragStart", function (e) {
|
|
28
|
+
var mapContainer = _this.mapsService.getContainer();
|
|
29
|
+
if (!mapContainer) {
|
|
30
|
+
return;
|
|
31
|
+
}
|
|
32
|
+
_this.mapsService.setMapStatus({
|
|
33
|
+
dragEnable: false,
|
|
34
|
+
zoomEnable: false
|
|
35
|
+
});
|
|
36
|
+
var _ref = mapContainer.getClientRects()[0],
|
|
37
|
+
containerX = _ref.left,
|
|
38
|
+
containerY = _ref.top;
|
|
39
|
+
var clickX = e.x,
|
|
40
|
+
clickY = e.y;
|
|
41
|
+
_this.preLngLat = _this.mapsService.containerToLngLat([clickX - containerX, clickY - containerY]);
|
|
42
|
+
_this.mapsService.on('mousemove', _this.onMarkerDragMove);
|
|
43
|
+
document.addEventListener('mouseup', _this.onMarkerDragEnd);
|
|
44
|
+
_this.emit('dragstart', _this.lngLat);
|
|
45
|
+
});
|
|
46
|
+
_defineProperty(_assertThisInitialized(_this), "onMarkerDragMove", function (e) {
|
|
47
|
+
var _this$preLngLat = _this.preLngLat,
|
|
48
|
+
preLng = _this$preLngLat.lng,
|
|
49
|
+
preLat = _this$preLngLat.lat;
|
|
50
|
+
var _e$lnglat = e.lnglat,
|
|
51
|
+
curLng = _e$lnglat.lng,
|
|
52
|
+
curLat = _e$lnglat.lat;
|
|
53
|
+
var newLngLat = {
|
|
54
|
+
lng: _this.lngLat.lng + curLng - preLng,
|
|
55
|
+
lat: _this.lngLat.lat + curLat - preLat
|
|
56
|
+
};
|
|
57
|
+
_this.setLnglat(newLngLat);
|
|
58
|
+
_this.preLngLat = e.lnglat;
|
|
59
|
+
_this.emit('dragging', newLngLat);
|
|
60
|
+
});
|
|
61
|
+
_defineProperty(_assertThisInitialized(_this), "onMarkerDragEnd", function (e) {
|
|
62
|
+
_this.mapsService.setMapStatus({
|
|
63
|
+
dragEnable: true,
|
|
64
|
+
zoomEnable: true
|
|
65
|
+
});
|
|
66
|
+
_this.mapsService.off('mousemove', _this.onMarkerDragMove);
|
|
67
|
+
document.removeEventListener('mouseup', _this.onMarkerDragEnd);
|
|
68
|
+
_this.emit('dragend', _this.lngLat);
|
|
69
|
+
});
|
|
23
70
|
_defineProperty(_assertThisInitialized(_this), "eventHandle", function (e) {
|
|
24
71
|
_this.polyfillEvent(e);
|
|
25
72
|
_this.emit(e.type, {
|
|
@@ -63,6 +110,7 @@ var Marker = /*#__PURE__*/function (_EventEmitter) {
|
|
|
63
110
|
this.registerMarkerEvent(element);
|
|
64
111
|
this.mapsService.on('camerachange', this.update); // 注册高德1.x 的地图事件监听
|
|
65
112
|
this.update();
|
|
113
|
+
this.updateDraggable();
|
|
66
114
|
this.added = true;
|
|
67
115
|
this.emit('added');
|
|
68
116
|
return this;
|
|
@@ -131,6 +179,7 @@ var Marker = /*#__PURE__*/function (_EventEmitter) {
|
|
|
131
179
|
this.init();
|
|
132
180
|
this.mapsService.getMarkerContainer().appendChild(el);
|
|
133
181
|
this.registerMarkerEvent(el);
|
|
182
|
+
this.updateDraggable();
|
|
134
183
|
this.update();
|
|
135
184
|
return this;
|
|
136
185
|
}
|
|
@@ -200,16 +249,15 @@ var Marker = /*#__PURE__*/function (_EventEmitter) {
|
|
|
200
249
|
value: function getOffset() {
|
|
201
250
|
return this.markerOption.offsets;
|
|
202
251
|
}
|
|
203
|
-
|
|
204
|
-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
205
252
|
}, {
|
|
206
253
|
key: "setDraggable",
|
|
207
254
|
value: function setDraggable(draggable) {
|
|
208
|
-
|
|
255
|
+
this.markerOption.draggable = draggable;
|
|
256
|
+
this.updateDraggable();
|
|
209
257
|
}
|
|
210
258
|
}, {
|
|
211
|
-
key: "
|
|
212
|
-
value: function
|
|
259
|
+
key: "getDraggable",
|
|
260
|
+
value: function getDraggable() {
|
|
213
261
|
return this.markerOption.draggable;
|
|
214
262
|
}
|
|
215
263
|
}, {
|
|
@@ -254,6 +302,17 @@ var Marker = /*#__PURE__*/function (_EventEmitter) {
|
|
|
254
302
|
bounds: this.mapsService.getBounds()
|
|
255
303
|
};
|
|
256
304
|
}
|
|
305
|
+
}, {
|
|
306
|
+
key: "updateDraggable",
|
|
307
|
+
value: function updateDraggable() {
|
|
308
|
+
var element = this.markerOption.element;
|
|
309
|
+
element === null || element === void 0 || element.removeEventListener('mousedown', this.onMarkerDragStart);
|
|
310
|
+
this.mapsService.off('mousemove', this.onMarkerDragMove);
|
|
311
|
+
document.removeEventListener('mouseup', this.onMarkerDragEnd);
|
|
312
|
+
if (this.markerOption.draggable) {
|
|
313
|
+
element === null || element === void 0 || element.addEventListener('mousedown', this.onMarkerDragStart);
|
|
314
|
+
}
|
|
315
|
+
}
|
|
257
316
|
}, {
|
|
258
317
|
key: "updatePosition",
|
|
259
318
|
value: function updatePosition() {
|
|
@@ -270,10 +329,10 @@ var Marker = /*#__PURE__*/function (_EventEmitter) {
|
|
|
270
329
|
if (element) {
|
|
271
330
|
element.style.display = 'block';
|
|
272
331
|
element.style.whiteSpace = 'nowrap';
|
|
273
|
-
var
|
|
274
|
-
containerHeight =
|
|
275
|
-
containerWidth =
|
|
276
|
-
bounds =
|
|
332
|
+
var _ref2 = this.getMarkerLayerContainerSize() || this.getCurrentContainerSize(),
|
|
333
|
+
containerHeight = _ref2.containerHeight,
|
|
334
|
+
containerWidth = _ref2.containerWidth,
|
|
335
|
+
bounds = _ref2.bounds;
|
|
277
336
|
if (!bounds) {
|
|
278
337
|
return;
|
|
279
338
|
}
|
package/lib/marker.js
CHANGED
|
@@ -27,6 +27,53 @@ var Marker = exports.default = /*#__PURE__*/function (_EventEmitter) {
|
|
|
27
27
|
(0, _classCallCheck2.default)(this, Marker);
|
|
28
28
|
_this = _super.call(this);
|
|
29
29
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "added", false);
|
|
30
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "preLngLat", {
|
|
31
|
+
lng: 0,
|
|
32
|
+
lat: 0
|
|
33
|
+
});
|
|
34
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMarkerDragStart", function (e) {
|
|
35
|
+
var mapContainer = _this.mapsService.getContainer();
|
|
36
|
+
if (!mapContainer) {
|
|
37
|
+
return;
|
|
38
|
+
}
|
|
39
|
+
_this.mapsService.setMapStatus({
|
|
40
|
+
dragEnable: false,
|
|
41
|
+
zoomEnable: false
|
|
42
|
+
});
|
|
43
|
+
var _ref = mapContainer.getClientRects()[0],
|
|
44
|
+
containerX = _ref.left,
|
|
45
|
+
containerY = _ref.top;
|
|
46
|
+
var clickX = e.x,
|
|
47
|
+
clickY = e.y;
|
|
48
|
+
_this.preLngLat = _this.mapsService.containerToLngLat([clickX - containerX, clickY - containerY]);
|
|
49
|
+
_this.mapsService.on('mousemove', _this.onMarkerDragMove);
|
|
50
|
+
document.addEventListener('mouseup', _this.onMarkerDragEnd);
|
|
51
|
+
_this.emit('dragstart', _this.lngLat);
|
|
52
|
+
});
|
|
53
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMarkerDragMove", function (e) {
|
|
54
|
+
var _this$preLngLat = _this.preLngLat,
|
|
55
|
+
preLng = _this$preLngLat.lng,
|
|
56
|
+
preLat = _this$preLngLat.lat;
|
|
57
|
+
var _e$lnglat = e.lnglat,
|
|
58
|
+
curLng = _e$lnglat.lng,
|
|
59
|
+
curLat = _e$lnglat.lat;
|
|
60
|
+
var newLngLat = {
|
|
61
|
+
lng: _this.lngLat.lng + curLng - preLng,
|
|
62
|
+
lat: _this.lngLat.lat + curLat - preLat
|
|
63
|
+
};
|
|
64
|
+
_this.setLnglat(newLngLat);
|
|
65
|
+
_this.preLngLat = e.lnglat;
|
|
66
|
+
_this.emit('dragging', newLngLat);
|
|
67
|
+
});
|
|
68
|
+
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onMarkerDragEnd", function (e) {
|
|
69
|
+
_this.mapsService.setMapStatus({
|
|
70
|
+
dragEnable: true,
|
|
71
|
+
zoomEnable: true
|
|
72
|
+
});
|
|
73
|
+
_this.mapsService.off('mousemove', _this.onMarkerDragMove);
|
|
74
|
+
document.removeEventListener('mouseup', _this.onMarkerDragEnd);
|
|
75
|
+
_this.emit('dragend', _this.lngLat);
|
|
76
|
+
});
|
|
30
77
|
(0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "eventHandle", function (e) {
|
|
31
78
|
_this.polyfillEvent(e);
|
|
32
79
|
_this.emit(e.type, {
|
|
@@ -70,6 +117,7 @@ var Marker = exports.default = /*#__PURE__*/function (_EventEmitter) {
|
|
|
70
117
|
this.registerMarkerEvent(element);
|
|
71
118
|
this.mapsService.on('camerachange', this.update); // 注册高德1.x 的地图事件监听
|
|
72
119
|
this.update();
|
|
120
|
+
this.updateDraggable();
|
|
73
121
|
this.added = true;
|
|
74
122
|
this.emit('added');
|
|
75
123
|
return this;
|
|
@@ -138,6 +186,7 @@ var Marker = exports.default = /*#__PURE__*/function (_EventEmitter) {
|
|
|
138
186
|
this.init();
|
|
139
187
|
this.mapsService.getMarkerContainer().appendChild(el);
|
|
140
188
|
this.registerMarkerEvent(el);
|
|
189
|
+
this.updateDraggable();
|
|
141
190
|
this.update();
|
|
142
191
|
return this;
|
|
143
192
|
}
|
|
@@ -207,16 +256,15 @@ var Marker = exports.default = /*#__PURE__*/function (_EventEmitter) {
|
|
|
207
256
|
value: function getOffset() {
|
|
208
257
|
return this.markerOption.offsets;
|
|
209
258
|
}
|
|
210
|
-
|
|
211
|
-
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
212
259
|
}, {
|
|
213
260
|
key: "setDraggable",
|
|
214
261
|
value: function setDraggable(draggable) {
|
|
215
|
-
|
|
262
|
+
this.markerOption.draggable = draggable;
|
|
263
|
+
this.updateDraggable();
|
|
216
264
|
}
|
|
217
265
|
}, {
|
|
218
|
-
key: "
|
|
219
|
-
value: function
|
|
266
|
+
key: "getDraggable",
|
|
267
|
+
value: function getDraggable() {
|
|
220
268
|
return this.markerOption.draggable;
|
|
221
269
|
}
|
|
222
270
|
}, {
|
|
@@ -261,6 +309,17 @@ var Marker = exports.default = /*#__PURE__*/function (_EventEmitter) {
|
|
|
261
309
|
bounds: this.mapsService.getBounds()
|
|
262
310
|
};
|
|
263
311
|
}
|
|
312
|
+
}, {
|
|
313
|
+
key: "updateDraggable",
|
|
314
|
+
value: function updateDraggable() {
|
|
315
|
+
var element = this.markerOption.element;
|
|
316
|
+
element === null || element === void 0 || element.removeEventListener('mousedown', this.onMarkerDragStart);
|
|
317
|
+
this.mapsService.off('mousemove', this.onMarkerDragMove);
|
|
318
|
+
document.removeEventListener('mouseup', this.onMarkerDragEnd);
|
|
319
|
+
if (this.markerOption.draggable) {
|
|
320
|
+
element === null || element === void 0 || element.addEventListener('mousedown', this.onMarkerDragStart);
|
|
321
|
+
}
|
|
322
|
+
}
|
|
264
323
|
}, {
|
|
265
324
|
key: "updatePosition",
|
|
266
325
|
value: function updatePosition() {
|
|
@@ -277,10 +336,10 @@ var Marker = exports.default = /*#__PURE__*/function (_EventEmitter) {
|
|
|
277
336
|
if (element) {
|
|
278
337
|
element.style.display = 'block';
|
|
279
338
|
element.style.whiteSpace = 'nowrap';
|
|
280
|
-
var
|
|
281
|
-
containerHeight =
|
|
282
|
-
containerWidth =
|
|
283
|
-
bounds =
|
|
339
|
+
var _ref2 = this.getMarkerLayerContainerSize() || this.getCurrentContainerSize(),
|
|
340
|
+
containerHeight = _ref2.containerHeight,
|
|
341
|
+
containerWidth = _ref2.containerWidth,
|
|
342
|
+
bounds = _ref2.bounds;
|
|
284
343
|
if (!bounds) {
|
|
285
344
|
return;
|
|
286
345
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@antv/l7-component",
|
|
3
|
-
"version": "2.20.
|
|
3
|
+
"version": "2.20.15",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "es/index.js",
|
|
@@ -26,8 +26,8 @@
|
|
|
26
26
|
"author": "lzxue",
|
|
27
27
|
"license": "ISC",
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@antv/l7-core": "2.20.
|
|
30
|
-
"@antv/l7-utils": "2.20.
|
|
29
|
+
"@antv/l7-core": "2.20.15",
|
|
30
|
+
"@antv/l7-utils": "2.20.15",
|
|
31
31
|
"@babel/runtime": "^7.7.7",
|
|
32
32
|
"eventemitter3": "^4.0.0",
|
|
33
33
|
"inversify": "^5.0.1",
|
|
@@ -35,12 +35,12 @@
|
|
|
35
35
|
"supercluster": "^7.0.0"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
|
-
"@antv/l7-layers": "2.20.
|
|
39
|
-
"@antv/l7-test-utils": "2.20.
|
|
38
|
+
"@antv/l7-layers": "2.20.15",
|
|
39
|
+
"@antv/l7-test-utils": "2.20.15",
|
|
40
40
|
"gcoord": "^0.3.2",
|
|
41
41
|
"less": "^4.1.3"
|
|
42
42
|
},
|
|
43
|
-
"gitHead": "
|
|
43
|
+
"gitHead": "283c12854a06cd2181552d6a9cf00d3e34bbd58e",
|
|
44
44
|
"publishConfig": {
|
|
45
45
|
"access": "public"
|
|
46
46
|
}
|