@antv/l7-layers 2.21.1 → 2.21.2

package/lib/plugins/DataMappingPlugin.js

@@ -5,275 +5,233 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _l7Core = require("@antv/l7-core");
 var _l7Utils = require("@antv/l7-utils");
-var cloneDeep = _l7Utils.lodashUtil.cloneDeep;
-var DataMappingPlugin = exports.default = /*#__PURE__*/function () {
-  function DataMappingPlugin() {
-    (0, _classCallCheck2.default)(this, DataMappingPlugin);
+const {
+  cloneDeep
+} = _l7Utils.lodashUtil;
+class DataMappingPlugin {
+  constructor() {
+    (0, _defineProperty2.default)(this, "mapService", void 0);
+    (0, _defineProperty2.default)(this, "fontService", void 0);
   }
-  (0, _createClass2.default)(DataMappingPlugin, [{
-    key: "apply",
-    value: function apply(layer, _ref) {
-      var _this = this;
-      var styleAttributeService = _ref.styleAttributeService,
-        mapService = _ref.mapService,
-        fontService = _ref.fontService;
-      this.mapService = mapService;
-      this.fontService = fontService;
-      layer.hooks.init.tapPromise('DataMappingPlugin', /*#__PURE__*/(0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
-        return _regenerator.default.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              layer.log(_l7Core.IDebugLog.MappingStart, _l7Core.ILayerStage.INIT);
-              // 初始化重新生成 map
-              _this.generateMaping(layer, {
-                styleAttributeService: styleAttributeService
-              });
-              layer.log(_l7Core.IDebugLog.MappingEnd, _l7Core.ILayerStage.INIT);
-            case 3:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee);
-      })));
-      layer.hooks.beforeRenderData.tapPromise('DataMappingPlugin', /*#__PURE__*/function () {
-        var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2(flag) {
-          var mappingResult;
-          return _regenerator.default.wrap(function _callee2$(_context2) {
-            while (1) switch (_context2.prev = _context2.next) {
-              case 0:
-                if (flag) {
-                  _context2.next = 2;
-                  break;
-                }
-                return _context2.abrupt("return", flag);
-              case 2:
-                layer.dataState.dataMappingNeedUpdate = false;
-                layer.log(_l7Core.IDebugLog.MappingStart, _l7Core.ILayerStage.UPDATE);
-                mappingResult = _this.generateMaping(layer, {
-                  styleAttributeService: styleAttributeService
-                });
-                layer.log(_l7Core.IDebugLog.MappingEnd, _l7Core.ILayerStage.UPDATE);
-                return _context2.abrupt("return", mappingResult);
-              case 7:
-              case "end":
-                return _context2.stop();
-            }
-          }, _callee2);
-        }));
-        return function (_x) {
-          return _ref3.apply(this, arguments);
-        };
-      }());
-
-      // remapping before render
-      layer.hooks.beforeRender.tap('DataMappingPlugin', function () {
-        var source = layer.getSource();
-        if (layer.layerModelNeedUpdate || !source || !source.inited) {
-          return;
-        }
-        var attributes = styleAttributeService.getLayerStyleAttributes() || [];
-        var filter = styleAttributeService.getLayerStyleAttribute('filter');
-        var dataArray = source.data.dataArray;
-        // TODO 数据为空的情况
-        if (Array.isArray(dataArray) && dataArray.length === 0) {
-          return;
-        }
-        var attributesToRemapping = attributes.filter(function (attribute) {
-          return attribute.needRemapping;
-        } // 如果filter变化
-        );
-        var filterData = dataArray;
-        // 数据过滤完 再执行数据映射
-        if (filter !== null && filter !== void 0 && filter.needRemapping && filter !== null && filter !== void 0 && filter.scale) {
-          filterData = dataArray.filter(function (record) {
-            return _this.applyAttributeMapping(filter, record)[0];
-          });
-        }
-        if (attributesToRemapping.length) {
-          // 过滤数据
-          var encodeData = _this.mapping(layer, attributesToRemapping, filterData, layer.getEncodedData() // TODO 优化
-          );
-          layer.setEncodedData(encodeData);
+  apply(layer, {
+    styleAttributeService,
+    mapService,
+    fontService
+  }) {
+    var _this = this;
+    this.mapService = mapService;
+    this.fontService = fontService;
+    layer.hooks.init.tapPromise('DataMappingPlugin', /*#__PURE__*/(0, _asyncToGenerator2.default)(function* () {
+      layer.log(_l7Core.IDebugLog.MappingStart, _l7Core.ILayerStage.INIT);
+      // 初始化重新生成 map
+      _this.generateMaping(layer, {
+        styleAttributeService
+      });
+      layer.log(_l7Core.IDebugLog.MappingEnd, _l7Core.ILayerStage.INIT);
+    }));
+    layer.hooks.beforeRenderData.tapPromise('DataMappingPlugin', /*#__PURE__*/function () {
+      var _ref2 = (0, _asyncToGenerator2.default)(function* (flag) {
+        if (!flag) {
+          return flag;
         }
-
-        // 处理文本更新，更新文字形状
-        // layer.emit('remapping', null);
+        layer.dataState.dataMappingNeedUpdate = false;
+        layer.log(_l7Core.IDebugLog.MappingStart, _l7Core.ILayerStage.UPDATE);
+        const mappingResult = _this.generateMaping(layer, {
+          styleAttributeService
+        });
+        layer.log(_l7Core.IDebugLog.MappingEnd, _l7Core.ILayerStage.UPDATE);
+        return mappingResult;
       });
-    }
-  }, {
-    key: "generateMaping",
-    value: function generateMaping(layer, _ref4) {
-      var _this2 = this;
-      var styleAttributeService = _ref4.styleAttributeService;
-      var attributes = styleAttributeService.getLayerStyleAttributes() || [];
-      var filter = styleAttributeService.getLayerStyleAttribute('filter');
-      var dataArray = layer.getSource().data.dataArray;
-      var filterData = dataArray;
+      return function (_x) {
+        return _ref2.apply(this, arguments);
+      };
+    }());
+
+    // remapping before render
+    layer.hooks.beforeRender.tap('DataMappingPlugin', () => {
+      const source = layer.getSource();
+      if (layer.layerModelNeedUpdate || !source || !source.inited) {
+        return;
+      }
+      const attributes = styleAttributeService.getLayerStyleAttributes() || [];
+      const filter = styleAttributeService.getLayerStyleAttribute('filter');
+      const {
+        dataArray
+      } = source.data;
+      // TODO 数据为空的情况
+      if (Array.isArray(dataArray) && dataArray.length === 0) {
+        return;
+      }
+      const attributesToRemapping = attributes.filter(attribute => attribute.needRemapping // 如果filter变化
+      );
+      let filterData = dataArray;
       // 数据过滤完 再执行数据映射
-      if (filter !== null && filter !== void 0 && filter.scale) {
-        filterData = dataArray.filter(function (record) {
-          return _this2.applyAttributeMapping(filter, record)[0];
+      if (filter !== null && filter !== void 0 && filter.needRemapping && filter !== null && filter !== void 0 && filter.scale) {
+        filterData = dataArray.filter(record => {
+          return this.applyAttributeMapping(filter, record)[0];
         });
       }
-      // Tip: layer 对数据做处理
-      // 数据处理 在数据进行 mapping 生成 encodeData 之前对数据进行处理
-      // 在各个 layer 中继承
-
-      filterData = layer.processData(filterData); // 目前只有简单线需要处理
-      var encodeData = this.mapping(layer, attributes, filterData, undefined);
-      layer.setEncodedData(encodeData);
+      if (attributesToRemapping.length) {
+        // 过滤数据
+        const encodeData = this.mapping(layer, attributesToRemapping, filterData, layer.getEncodedData() // TODO 优化
+        );
+        layer.setEncodedData(encodeData);
+      }
 
-      // 对外暴露事件
-      layer.emit('dataUpdate', null);
-      return true;
-    }
-  }, {
-    key: "mapping",
-    value: function mapping(layer, attributes, data, predata) {
-      var _this3 = this;
-      var usedAttributes = attributes.filter(function (attribute) {
-        return attribute.scale !== undefined;
-      }).filter(function (attribute) {
-        return attribute.name !== 'filter';
+      // 处理文本更新，更新文字形状
+      // layer.emit('remapping', null);
+    });
+  }
+  generateMaping(layer, {
+    styleAttributeService
+  }) {
+    const attributes = styleAttributeService.getLayerStyleAttributes() || [];
+    const filter = styleAttributeService.getLayerStyleAttribute('filter');
+    const {
+      dataArray
+    } = layer.getSource().data;
+    let filterData = dataArray;
+    // 数据过滤完 再执行数据映射
+    if (filter !== null && filter !== void 0 && filter.scale) {
+      filterData = dataArray.filter(record => {
+        return this.applyAttributeMapping(filter, record)[0];
       });
-      var mappedData = data.map(function (record, i) {
-        var preRecord = predata ? predata[i] : {};
-        var encodeRecord = (0, _objectSpread2.default)({
-          id: record._id,
-          coordinates: record.coordinates
-        }, preRecord);
-        usedAttributes.forEach(function (attribute) {
-          var values = _this3.applyAttributeMapping(attribute, record);
-          // TODO: 支持每个属性配置 postprocess}
-          if (attribute.name === 'color' || attribute.name === 'stroke') {
-            values = values.map(function (c) {
-              return (0, _l7Utils.rgb2arr)(c);
-            });
-          }
-          // @ts-ignore
-          encodeRecord[attribute.name] = Array.isArray(values) && values.length === 1 ? values[0] : values;
+    }
+    // Tip: layer 对数据做处理
+    // 数据处理 在数据进行 mapping 生成 encodeData 之前对数据进行处理
+    // 在各个 layer 中继承
 
-          // 增加对 layer/text/iconfont unicode 映射的解析
-          if (attribute.name === 'shape') {
-            encodeRecord.shape = _this3.fontService.getIconFontKey(encodeRecord[attribute.name]);
-          }
-        });
-        return encodeRecord;
-      });
-      attributes.forEach(function (attribute) {
-        attribute.needRemapping = false;
+    filterData = layer.processData(filterData); // 目前只有简单线需要处理
+    const encodeData = this.mapping(layer, attributes, filterData, undefined);
+    layer.setEncodedData(encodeData);
+
+    // 对外暴露事件
+    layer.emit('dataUpdate', null);
+    return true;
+  }
+  mapping(layer, attributes, data, predata) {
+    const usedAttributes = attributes.filter(attribute => attribute.scale !== undefined).filter(attribute => attribute.name !== 'filter');
+    const mappedData = data.map((record, i) => {
+      const preRecord = predata ? predata[i] : {};
+      const encodeRecord = (0, _objectSpread2.default)({
+        id: record._id,
+        coordinates: record.coordinates
+      }, preRecord);
+      usedAttributes.forEach(attribute => {
+        let values = this.applyAttributeMapping(attribute, record);
+        // TODO: 支持每个属性配置 postprocess}
+        if (attribute.name === 'color' || attribute.name === 'stroke') {
+          values = values.map(c => {
+            return (0, _l7Utils.rgb2arr)(c);
+          });
+        }
+        // @ts-ignore
+        encodeRecord[attribute.name] = Array.isArray(values) && values.length === 1 ? values[0] : values;
+
+        // 增加对 layer/text/iconfont unicode 映射的解析
+        if (attribute.name === 'shape') {
+          encodeRecord.shape = this.fontService.getIconFontKey(encodeRecord[attribute.name]);
+        }
       });
-      // 调整数据兼容 Amap2.0
-      this.adjustData2Amap2Coordinates(mappedData, layer);
+      return encodeRecord;
+    });
+    attributes.forEach(attribute => {
+      attribute.needRemapping = false;
+    });
+    // 调整数据兼容 Amap2.0
+    this.adjustData2Amap2Coordinates(mappedData, layer);
 
-      // 调整数据兼容 SimpleCoordinates
-      this.adjustData2SimpleCoordinates(mappedData);
-      return mappedData;
-    }
-  }, {
-    key: "adjustData2Amap2Coordinates",
-    value: function adjustData2Amap2Coordinates(mappedData, layer) {
-      var _this4 = this;
-      // 根据地图的类型判断是否需要对点位数据进行处理, 若是高德2.0则需要对坐标进行相对偏移
-      if (mappedData.length > 0 && this.mapService.version === 'GAODE2.x') {
-        var layerCenter = layer.coordCenter || layer.getSource().center;
-        // 单个的点数据
+    // 调整数据兼容 SimpleCoordinates
+    this.adjustData2SimpleCoordinates(mappedData);
+    return mappedData;
+  }
+  adjustData2Amap2Coordinates(mappedData, layer) {
+    // 根据地图的类型判断是否需要对点位数据进行处理, 若是高德2.0则需要对坐标进行相对偏移
+    if (mappedData.length > 0 && this.mapService.version === 'GAODE2.x') {
+      const layerCenter = layer.coordCenter || layer.getSource().center;
+      // 单个的点数据
+      // @ts-ignore
+      mappedData
+      // TODO: 避免经纬度被重复计算导致坐标位置偏移
+      .filter(d => !d.originCoordinates).map(d => {
+        d.version = 'GAODE2.x';
         // @ts-ignore
-        mappedData
-        // TODO: 避免经纬度被重复计算导致坐标位置偏移
-        .filter(function (d) {
-          return !d.originCoordinates;
-        }).map(function (d) {
-          d.version = 'GAODE2.x';
-          // @ts-ignore
-          d.originCoordinates = cloneDeep(d.coordinates); // 为了兼容高德1.x 需要保存一份原始的经纬度坐标数据（许多上层逻辑依赖经纬度数据）
-          // @ts-ignore
-          // d.coordinates = this.mapService.lngLatToCoord(d.coordinates);
-          d.coordinates = _this4.mapService.coordToAMap2RelativeCoordinates(d.coordinates, layerCenter);
-        });
-      }
+        d.originCoordinates = cloneDeep(d.coordinates); // 为了兼容高德1.x 需要保存一份原始的经纬度坐标数据（许多上层逻辑依赖经纬度数据）
+        // @ts-ignore
+        // d.coordinates = this.mapService.lngLatToCoord(d.coordinates);
+        d.coordinates = this.mapService.coordToAMap2RelativeCoordinates(d.coordinates, layerCenter);
+      });
     }
-  }, {
-    key: "adjustData2SimpleCoordinates",
-    value: function adjustData2SimpleCoordinates(mappedData) {
-      var _this5 = this;
-      if (mappedData.length > 0 && this.mapService.version === 'SIMPLE') {
-        mappedData.map(function (d) {
-          if (!d.simpleCoordinate) {
-            d.coordinates = _this5.unProjectCoordinates(d.coordinates);
-            d.simpleCoordinate = true;
-          }
-        });
-      }
+  }
+  adjustData2SimpleCoordinates(mappedData) {
+    if (mappedData.length > 0 && this.mapService.version === 'SIMPLE') {
+      mappedData.map(d => {
+        if (!d.simpleCoordinate) {
+          d.coordinates = this.unProjectCoordinates(d.coordinates);
+          d.simpleCoordinate = true;
+        }
+      });
     }
-  }, {
-    key: "unProjectCoordinates",
-    value: function unProjectCoordinates(coordinates) {
-      var _this6 = this;
-      if (typeof coordinates[0] === 'number') {
-        return this.mapService.simpleMapCoord.unproject(coordinates);
-      }
-      if (coordinates[0] && coordinates[0][0] instanceof Array) {
-        // @ts-ignore
-        var coords = [];
-        coordinates.map(function (coord) {
-          // @ts-ignore
-          var c1 = [];
-          coord.map(function (co) {
-            c1.push(_this6.mapService.simpleMapCoord.unproject(co));
-          });
-          // @ts-ignore
-          coords.push(c1);
-        });
-        // @ts-ignore
-        return coords;
-      } else {
-        // @ts-ignore
-        var _coords = [];
+  }
+  unProjectCoordinates(coordinates) {
+    if (typeof coordinates[0] === 'number') {
+      return this.mapService.simpleMapCoord.unproject(coordinates);
+    }
+    if (coordinates[0] && coordinates[0][0] instanceof Array) {
+      // @ts-ignore
+      const coords = [];
+      coordinates.map(coord => {
         // @ts-ignore
-        coordinates.map(function (coord) {
-          _coords.push(_this6.mapService.simpleMapCoord.unproject(coord));
+        const c1 = [];
+        coord.map(co => {
+          c1.push(this.mapService.simpleMapCoord.unproject(co));
         });
         // @ts-ignore
-        return _coords;
-      }
-    }
-  }, {
-    key: "applyAttributeMapping",
-    value: function applyAttributeMapping(attribute, record) {
-      var _attribute$scale;
-      if (!attribute.scale) {
-        return [];
-      }
-      var scalers = (attribute === null || attribute === void 0 || (_attribute$scale = attribute.scale) === null || _attribute$scale === void 0 ? void 0 : _attribute$scale.scalers) || [];
-      var params = [];
-      scalers.forEach(function (_ref5) {
-        var _attribute$scale2;
-        var field = _ref5.field;
-        if (record.hasOwnProperty(field) || ((_attribute$scale2 = attribute.scale) === null || _attribute$scale2 === void 0 ? void 0 : _attribute$scale2.type) === 'variable') {
-          // TODO:多字段，常量
-          params.push(record[field]);
-        }
+        coords.push(c1);
       });
-      var mappingResult = attribute.mapping ? attribute.mapping(params) : [];
-      return mappingResult;
-      // return attribute.mapping ? attribute.mapping(params) : [];
+      // @ts-ignore
+      return coords;
+    } else {
+      // @ts-ignore
+      const coords = [];
+      // @ts-ignore
+      coordinates.map(coord => {
+        coords.push(this.mapService.simpleMapCoord.unproject(coord));
+      });
+      // @ts-ignore
+      return coords;
     }
-  }, {
-    key: "getArrowPoints",
-    value: function getArrowPoints(p1, p2) {
-      var dir = [p2[0] - p1[0], p2[1] - p1[1]];
-      var normalizeDir = (0, _l7Utils.normalize)(dir);
-      var arrowPoint = [p1[0] + normalizeDir[0] * 0.0001, p1[1] + normalizeDir[1] * 0.0001];
-      return arrowPoint;
+  }
+  applyAttributeMapping(attribute, record) {
+    var _attribute$scale;
+    if (!attribute.scale) {
+      return [];
     }
-  }]);
-  return DataMappingPlugin;
-}();
+    const scalers = (attribute === null || attribute === void 0 || (_attribute$scale = attribute.scale) === null || _attribute$scale === void 0 ? void 0 : _attribute$scale.scalers) || [];
+    const params = [];
+    scalers.forEach(({
+      field
+    }) => {
+      var _attribute$scale2;
+      if (record.hasOwnProperty(field) || ((_attribute$scale2 = attribute.scale) === null || _attribute$scale2 === void 0 ? void 0 : _attribute$scale2.type) === 'variable') {
+        // TODO:多字段，常量
+        params.push(record[field]);
+      }
+    });
+    const mappingResult = attribute.mapping ? attribute.mapping(params) : [];
+    return mappingResult;
+    // return attribute.mapping ? attribute.mapping(params) : [];
+  }
+  getArrowPoints(p1, p2) {
+    const dir = [p2[0] - p1[0], p2[1] - p1[1]];
+    const normalizeDir = (0, _l7Utils.normalize)(dir);
+    const arrowPoint = [p1[0] + normalizeDir[0] * 0.0001, p1[1] + normalizeDir[1] * 0.0001];
+    return arrowPoint;
+  }
+}
+exports.default = DataMappingPlugin;

package/lib/plugins/DataSourcePlugin.d.ts

@@ -0,0 +1,6 @@
+import type { ILayer, ILayerPlugin, IMapService } from '@antv/l7-core';
+export default class DataSourcePlugin implements ILayerPlugin {
+    protected mapService: IMapService;
+    apply(layer: ILayer): void;
+    private updateClusterData;
+}