@antv/l7-component 2.9.26 → 2.9.27-alpha.2

package/es/marker-layer.js

@@ -60,7 +60,8 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
           className: ''
         }
       };
-    }
+    } // 执行scene.addMarkerLayer时调用
+
   }, {
     key: "addTo",
     value: function addTo(scene) {
@@ -83,7 +84,8 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
 
       this.addMarkers();
       return this;
-    }
+    } // 设置容器大小
+
   }, {
     key: "setContainerSize",
     value: function setContainerSize() {
@@ -94,12 +96,14 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
         containerHeight: (container === null || container === void 0 ? void 0 : container.scrollHeight) || 0,
         bounds: this.mapsService.getBounds()
       };
-    }
+    } // 获取容器尺寸
+
   }, {
     key: "getContainerSize",
     value: function getContainerSize() {
       return this.containerSize;
-    }
+    } // 在图层添加单个marker
+
   }, {
     key: "addMarker",
     value: function addMarker(marker) {
@@ -158,13 +162,15 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
       this.clusterMarkers.map(function (m) {
         m.getElement().style.opacity = '1';
       });
-    }
+    } // 返回当下的markers数据，有聚合图时返回聚合的marker列表，否则返回原始maerker列表
+
   }, {
     key: "getMarkers",
     value: function getMarkers() {
       var cluster = this.markerLayerOption.cluster;
       return cluster ? this.clusterMarkers : this.markers;
-    }
+    } // 批量添加marker到scene
+
   }, {
     key: "addMarkers",
     value: function addMarkers() {
@@ -173,7 +179,8 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
       this.getMarkers().forEach(function (marker) {
         marker.addTo(_this2.scene);
       });
-    }
+    } // 清除图层里的marker
+
   }, {
     key: "clear",
     value: function clear() {
@@ -183,9 +190,6 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
       this.clusterMarkers.forEach(function (clusterMarker) {
         clusterMarker.remove();
       });
-      this.mapsService.off('camerachange', this.update);
-      this.mapsService.off('camerachange', this.setContainerSize.bind(this));
-      this.mapsService.off('viewchange', this.setContainerSize.bind(this));
       this.markers = [];
       this.points = [];
       this.clusterMarkers = [];
@@ -195,7 +199,12 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
     value: function destroy() {
       this.clear();
       this.removeAllListeners();
-    }
+      this.mapsService.off('camerachange', this.update);
+      this.mapsService.off('viewchange', this.update);
+      this.mapsService.off('camerachange', this.setContainerSize.bind(this));
+      this.mapsService.off('viewchange', this.setContainerSize.bind(this));
+    } // 将marker数据保存在point中
+
   }, {
     key: "addPoint",
     value: function addPoint(marker, id) {
@@ -226,11 +235,11 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
         return;
       }
 
-      var _ref = this.markerLayerOption.clusterOption,
-          radius = _ref.radius,
-          _ref$minZoom = _ref.minZoom,
-          minZoom = _ref$minZoom === void 0 ? 0 : _ref$minZoom,
-          maxZoom = _ref.maxZoom;
+      var _this$markerLayerOpti2 = this.markerLayerOption.clusterOption,
+          radius = _this$markerLayerOpti2.radius,
+          _this$markerLayerOpti3 = _this$markerLayerOpti2.minZoom,
+          minZoom = _this$markerLayerOpti3 === void 0 ? 0 : _this$markerLayerOpti3,
+          maxZoom = _this$markerLayerOpti2.maxZoom;
       this.clusterIndex = new Supercluster({
         radius: radius,
         minZoom: minZoom,
@@ -257,7 +266,7 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
             field = _this3$markerLayerOpt.field,
             method = _this3$markerLayerOpt.method; // 处理聚合数据
 
-        if (feature.properties && (_feature$properties = feature.properties) !== null && _feature$properties !== void 0 && _feature$properties.cluster_id) {
+        if ((_feature$properties = feature.properties) !== null && _feature$properties !== void 0 && _feature$properties.cluster_id) {
           var _feature$properties2;
 
           var clusterData = _this3.getLeaves((_feature$properties2 = feature.properties) === null || _feature$properties2 === void 0 ? void 0 : _feature$properties2.cluster_id);
@@ -300,9 +309,9 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
     key: "clusterMarker",
     value: function clusterMarker(feature) {
       var clusterOption = this.markerLayerOption.clusterOption;
-      var _ref2 = clusterOption,
-          _ref2$element = _ref2.element,
-          element = _ref2$element === void 0 ? this.generateElement.bind(this) : _ref2$element;
+      var _ref = clusterOption,
+          _ref$element = _ref.element,
+          element = _ref$element === void 0 ? this.generateElement.bind(this) : _ref$element;
       var marker = new Marker({
         element: element(feature)
       }).setLnglat({
@@ -320,10 +329,9 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
   }, {
     key: "update",
     value: function update() {
-      if (!this.mapsService) {
-        return;
-      }
+      if (!this.mapsService) return; // 当图层中无marker时，无需更新
 
+      if (this.markers.length === 0) return;
       var zoom = this.mapsService.getZoom();
       var bbox = this.mapsService.getBounds();
 
@@ -339,9 +347,9 @@ var MarkerLayer = /*#__PURE__*/function (_EventEmitter) {
       var el = DOM.create('div', 'l7-marker-cluster');
       var label = DOM.create('div', '', el);
       var span = DOM.create('span', '', label);
-      var _this$markerLayerOpti2 = this.markerLayerOption.clusterOption,
-          field = _this$markerLayerOpti2.field,
-          method = _this$markerLayerOpti2.method;
+      var _this$markerLayerOpti4 = this.markerLayerOption.clusterOption,
+          field = _this$markerLayerOpti4.field,
+          method = _this$markerLayerOpti4.method;
       feature.properties.point_count = feature.properties.point_count || 1;
       var text = field && method ? feature.properties['point_' + method] || feature.properties[field] : feature.properties.point_count;
       span.textContent = text;

package/lib/marker-layer.js

@@ -136,9 +136,6 @@ var MarkerLayer = class extends import_eventemitter3.EventEmitter {
     this.clusterMarkers.forEach((clusterMarker) => {
       clusterMarker.remove();
     });
-    this.mapsService.off("camerachange", this.update);
-    this.mapsService.off("camerachange", this.setContainerSize.bind(this));
-    this.mapsService.off("viewchange", this.setContainerSize.bind(this));
     this.markers = [];
     this.points = [];
     this.clusterMarkers = [];
@@ -146,6 +143,10 @@ var MarkerLayer = class extends import_eventemitter3.EventEmitter {
   destroy() {
     this.clear();
     this.removeAllListeners();
+    this.mapsService.off("camerachange", this.update);
+    this.mapsService.off("viewchange", this.update);
+    this.mapsService.off("camerachange", this.setContainerSize.bind(this));
+    this.mapsService.off("viewchange", this.setContainerSize.bind(this));
   }
   addPoint(marker, id) {
     const { lng, lat } = marker.getLnglat();
@@ -168,7 +169,11 @@ var MarkerLayer = class extends import_eventemitter3.EventEmitter {
     if (!this.markerLayerOption.cluster) {
       return;
     }
-    const { radius, minZoom = 0, maxZoom } = this.markerLayerOption.clusterOption;
+    const {
+      radius,
+      minZoom = 0,
+      maxZoom
+    } = this.markerLayerOption.clusterOption;
     this.clusterIndex = new import_supercluster.default({
       radius,
       minZoom,
@@ -186,7 +191,7 @@ var MarkerLayer = class extends import_eventemitter3.EventEmitter {
     clusterPoint.forEach((feature) => {
       var _a, _b;
       const { field, method } = this.markerLayerOption.clusterOption;
-      if (feature.properties && ((_a = feature.properties) == null ? void 0 : _a.cluster_id)) {
+      if ((_a = feature.properties) == null ? void 0 : _a.cluster_id) {
         const clusterData = this.getLeaves((_b = feature.properties) == null ? void 0 : _b.cluster_id);
         feature.properties.clusterData = clusterData;
         if (field && method) {
@@ -231,9 +236,10 @@ var MarkerLayer = class extends import_eventemitter3.EventEmitter {
     return this.markers[marker_id];
   }
   update() {
-    if (!this.mapsService) {
+    if (!this.mapsService)
+      return;
+    if (this.markers.length === 0)
       return;
-    }
     const zoom = this.mapsService.getZoom();
     const bbox = this.mapsService.getBounds();
     if (!this.bbox || Math.abs(zoom - this.zoom) >= 1 || !(0, import_l7_utils.boundsContains)(this.bbox, bbox)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antv/l7-component",
-  "version": "2.9.26",
+  "version": "2.9.27-alpha.2",
   "description": "",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -25,8 +25,8 @@
   "author": "lzxue",
   "license": "ISC",
   "dependencies": {
-    "@antv/l7-core": "2.9.26",
-    "@antv/l7-utils": "2.9.26",
+    "@antv/l7-core": "2.9.27-alpha.2",
+    "@antv/l7-utils": "2.9.27-alpha.2",
     "@babel/runtime": "^7.7.7",
     "eventemitter3": "^4.0.0",
     "inversify": "^5.0.1",
@@ -35,9 +35,9 @@
     "supercluster": "^7.0.0"
   },
   "devDependencies": {
-    "@antv/l7-test-utils": "2.9.26"
+    "@antv/l7-test-utils": "2.9.27-alpha.2"
   },
-  "gitHead": "4e6f44c4ae44f7e9b9bbe627fd35406b3e7a63e1",
+  "gitHead": "209f0b76af7ad1c7342f5ea21aa1c2179e8c460d",
   "publishConfig": {
     "access": "public"
   }