@antv/l7-layers 2.21.1 → 2.21.2

package/es/point/index.js

@@ -1,34 +1,15 @@
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-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); }; }
-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; } }
 import BaseLayer from "../core/BaseLayer";
 import PointModels from "./models/index";
-var PointLayer = /*#__PURE__*/function (_BaseLayer) {
-  _inherits(PointLayer, _BaseLayer);
-  var _super = _createSuper(PointLayer);
-  function PointLayer() {
-    var _this;
-    _classCallCheck(this, PointLayer);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "type", 'PointLayer');
-    _defineProperty(_assertThisInitialized(_this), "enableShaderEncodeStyles", ['stroke', 'offsets', 'opacity', 'rotation']);
+export default class PointLayer extends BaseLayer {
+  constructor(...args) {
+    super(...args);
+    _defineProperty(this, "type", 'PointLayer');
+    _defineProperty(this, "enableShaderEncodeStyles", ['stroke', 'offsets', 'opacity', 'rotation']);
     //4+2+1+1
-    _defineProperty(_assertThisInitialized(_this), "enableDataEncodeStyles", ['textOffset', 'textAnchor']);
-    _defineProperty(_assertThisInitialized(_this), "defaultSourceConfig", {
+    _defineProperty(this, "enableDataEncodeStyles", ['textOffset', 'textAnchor']);
+    _defineProperty(this, "defaultSourceConfig", {
       data: [],
       options: {
         parser: {
@@ -38,170 +19,125 @@ var PointLayer = /*#__PURE__*/function (_BaseLayer) {
         }
       }
     });
-    return _this;
   }
-  _createClass(PointLayer, [{
-    key: "buildModels",
-    value: function () {
-      var _buildModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-        var modelType;
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              modelType = this.getModelType();
-              if (this.layerModel) {
-                this.layerModel.clearModels();
-              }
-              this.layerModel = new PointModels[modelType](this);
-              _context.next = 5;
-              return this.initLayerModels();
-            case 5:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee, this);
-      }));
-      function buildModels() {
-        return _buildModels.apply(this, arguments);
+  buildModels() {
+    var _this = this;
+    return _asyncToGenerator(function* () {
+      const modelType = _this.getModelType();
+      if (_this.layerModel) {
+        _this.layerModel.clearModels();
       }
-      return buildModels;
-    }()
-  }, {
-    key: "rebuildModels",
-    value: function () {
-      var _rebuildModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              _context2.next = 2;
-              return this.buildModels();
-            case 2:
-            case "end":
-              return _context2.stop();
-          }
-        }, _callee2, this);
-      }));
-      function rebuildModels() {
-        return _rebuildModels.apply(this, arguments);
+      _this.layerModel = new PointModels[modelType](_this);
+      yield _this.initLayerModels();
+    })();
+  }
+  rebuildModels() {
+    var _this2 = this;
+    return _asyncToGenerator(function* () {
+      yield _this2.buildModels();
+    })();
+  }
+
+  /**
+   * 在未传入数据的时候判断点图层的 shape 类型
+   * @returns
+   */
+  getModelTypeWillEmptyData() {
+    if (this.shapeOption) {
+      const {
+        field,
+        values
+      } = this.shapeOption;
+      const {
+        shape2d
+      } = this.getLayerConfig();
+      const iconMap = this.iconService.getIconMap();
+      if (field && (shape2d === null || shape2d === void 0 ? void 0 : shape2d.indexOf(field)) !== -1) {
+        return 'fill';
       }
-      return rebuildModels;
-    }()
-    /**
-     * 在未传入数据的时候判断点图层的 shape 类型
-     * @returns
-     */
-  }, {
-    key: "getModelTypeWillEmptyData",
-    value: function getModelTypeWillEmptyData() {
-      if (this.shapeOption) {
-        var _this$shapeOption = this.shapeOption,
-          field = _this$shapeOption.field,
-          values = _this$shapeOption.values;
-        var _this$getLayerConfig = this.getLayerConfig(),
-          shape2d = _this$getLayerConfig.shape2d;
-        var iconMap = this.iconService.getIconMap();
-        if (field && (shape2d === null || shape2d === void 0 ? void 0 : shape2d.indexOf(field)) !== -1) {
-          return 'fill';
-        }
-        if (values === 'text') {
-          return 'text';
-        }
-        if (values && values instanceof Array) {
-          var _iterator = _createForOfIteratorHelper(values),
-            _step;
-          try {
-            for (_iterator.s(); !(_step = _iterator.n()).done;) {
-              var v = _step.value;
-              if (typeof v === 'string' && iconMap.hasOwnProperty(v)) {
-                return 'image';
-              }
-            }
-          } catch (err) {
-            _iterator.e(err);
-          } finally {
-            _iterator.f();
+      if (values === 'text') {
+        return 'text';
+      }
+      if (values && values instanceof Array) {
+        for (const v of values) {
+          if (typeof v === 'string' && iconMap.hasOwnProperty(v)) {
+            return 'image';
           }
         }
       }
-      return 'normal';
     }
-  }, {
-    key: "getDefaultConfig",
-    value: function getDefaultConfig() {
-      var type = this.getModelType();
-      var defaultConfig = {
-        fillImage: {},
-        normal: {
-          blend: 'additive'
-        },
-        radar: {},
-        simplePoint: {},
-        fill: {
-          blend: 'normal'
-        },
-        extrude: {},
-        image: {},
-        text: {
-          blend: 'normal'
-        },
-        tile: {},
-        tileText: {},
-        earthFill: {},
-        earthExtrude: {}
-      };
-      return defaultConfig[type];
-    }
-  }, {
-    key: "getModelType",
-    value: function getModelType() {
-      //  2D、 3d、 shape、image、text、normal、
-      var layerData = this.getEncodedData();
-      var _this$getLayerConfig2 = this.getLayerConfig(),
-        shape2d = _this$getLayerConfig2.shape2d,
-        shape3d = _this$getLayerConfig2.shape3d,
-        _this$getLayerConfig3 = _this$getLayerConfig2.billboard,
-        billboard = _this$getLayerConfig3 === void 0 ? true : _this$getLayerConfig3;
-      var iconMap = this.iconService.getIconMap();
-      var item = layerData.find(function (fe) {
-        return fe.hasOwnProperty('shape');
-      });
-      if (!item) {
-        return this.getModelTypeWillEmptyData();
-      } else {
-        var shape = item.shape;
-        if (shape === 'dot') {
-          return 'normal';
-        }
-        if (shape === 'simple') {
-          return 'simplePoint';
-        }
-        if (shape === 'radar') {
-          return 'radar';
-        }
-        if (this.layerType === 'fillImage' || billboard === false) {
-          return 'fillImage';
-        }
-        if ((shape2d === null || shape2d === void 0 ? void 0 : shape2d.indexOf(shape)) !== -1) {
-          if (this.mapService.version === 'GLOBEL') {
-            return 'earthFill';
-          } else {
-            return 'fill';
-          }
-        }
-        if ((shape3d === null || shape3d === void 0 ? void 0 : shape3d.indexOf(shape)) !== -1) {
-          if (this.mapService.version === 'GLOBEL') {
-            return 'earthExtrude';
-          } else {
-            return 'extrude';
-          }
+    return 'normal';
+  }
+  getDefaultConfig() {
+    const type = this.getModelType();
+    const defaultConfig = {
+      fillImage: {},
+      normal: {
+        blend: 'additive'
+      },
+      radar: {},
+      simplePoint: {},
+      fill: {
+        blend: 'normal'
+      },
+      extrude: {},
+      image: {},
+      text: {
+        blend: 'normal'
+      },
+      tile: {},
+      tileText: {},
+      earthFill: {},
+      earthExtrude: {}
+    };
+    return defaultConfig[type];
+  }
+  getModelType() {
+    //  2D、 3d、 shape、image、text、normal、
+    const layerData = this.getEncodedData();
+    const {
+      shape2d,
+      shape3d,
+      billboard = true
+    } = this.getLayerConfig();
+    const iconMap = this.iconService.getIconMap();
+    const item = layerData.find(fe => {
+      return fe.hasOwnProperty('shape');
+    });
+    if (!item) {
+      return this.getModelTypeWillEmptyData();
+    } else {
+      const shape = item.shape;
+      if (shape === 'dot') {
+        return 'normal';
+      }
+      if (shape === 'simple') {
+        return 'simplePoint';
+      }
+      if (shape === 'radar') {
+        return 'radar';
+      }
+      if (this.layerType === 'fillImage' || billboard === false) {
+        return 'fillImage';
+      }
+      if ((shape2d === null || shape2d === void 0 ? void 0 : shape2d.indexOf(shape)) !== -1) {
+        if (this.mapService.version === 'GLOBEL') {
+          return 'earthFill';
+        } else {
+          return 'fill';
         }
-        if (iconMap.hasOwnProperty(shape)) {
-          return 'image';
+      }
+      if ((shape3d === null || shape3d === void 0 ? void 0 : shape3d.indexOf(shape)) !== -1) {
+        if (this.mapService.version === 'GLOBEL') {
+          return 'earthExtrude';
+        } else {
+          return 'extrude';
         }
-        return 'text';
       }
+      if (iconMap.hasOwnProperty(shape)) {
+        return 'image';
+      }
+      return 'text';
     }
-  }]);
-  return PointLayer;
-}(BaseLayer);
-export { PointLayer as default };
+  }
+}

package/es/point/models/billboard_point.js

@@ -1,142 +1,87 @@
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-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); }; }
-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; } }
 import { AttributeType, gl } from '@antv/l7-core';
 import BaseModel from "../../core/BaseModel";
 import { rgb2arr } from '@antv/l7-utils';
 import { ShaderLocation } from "../../core/CommonStyleAttribute";
 /* babel-plugin-inline-import '../shaders/billboard/billboard_point_frag.glsl' */
-var simplePointFrag = "\nlayout(std140) uniform commonUniorm {\n  vec4 u_stroke_color;\n  float u_additive;\n  float u_stroke_opacity;\n  float u_stroke_width;\n};\n\nin vec4 v_color;\nin float v_blur;\nin float v_innerRadius;\n\nout vec4 outputColor;\n\n#pragma include \"picking\"\nvoid main() {\n  vec2 center = vec2(0.5);\n\n  // Tip: \u7247\u5143\u5230\u4E2D\u5FC3\u70B9\u7684\u8DDD\u79BB 0 - 1\n  float fragmengTocenter = distance(center, gl_PointCoord) * 2.0;\n  // Tip: \u7247\u5143\u7684\u526A\u5207\u6210\u5706\u5F62\n  float circleClipOpacity = 1.0 - smoothstep(v_blur, 1.0, fragmengTocenter);\n\n\n  if(v_innerRadius < 0.99) {\n    // \u5F53\u5B58\u5728 stroke \u4E14 stroke > 0.01\n    float blurWidth = (1.0 - v_blur)/2.0;\n    vec4 stroke = vec4(u_stroke_color.rgb, u_stroke_opacity);\n    if(fragmengTocenter > v_innerRadius + blurWidth) {\n      outputColor = stroke;\n    } else if(fragmengTocenter > v_innerRadius - blurWidth){\n      float mixR = (fragmengTocenter - (v_innerRadius - blurWidth)) / (blurWidth * 2.0);\n      outputColor = mix(v_color, stroke, mixR);\n    } else {\n      outputColor = v_color;\n    }\n  } else {\n    // \u5F53\u4E0D\u5B58\u5728 stroke \u6216 stroke <= 0.01\n    outputColor = v_color;\n  }\n\n  outputColor = filterColor(outputColor);\n  \n  if(u_additive > 0.0) {\n    outputColor *= circleClipOpacity;\n  } else {\n    outputColor.a *= circleClipOpacity;\n  }\n\n}\n";
+const simplePointFrag = "\nlayout(std140) uniform commonUniorm {\n  vec4 u_stroke_color;\n  float u_additive;\n  float u_stroke_opacity;\n  float u_stroke_width;\n};\n\nin vec4 v_color;\nin float v_blur;\nin float v_innerRadius;\n\nout vec4 outputColor;\n\n#pragma include \"picking\"\nvoid main() {\n  vec2 center = vec2(0.5);\n\n  // Tip: \u7247\u5143\u5230\u4E2D\u5FC3\u70B9\u7684\u8DDD\u79BB 0 - 1\n  float fragmengTocenter = distance(center, gl_PointCoord) * 2.0;\n  // Tip: \u7247\u5143\u7684\u526A\u5207\u6210\u5706\u5F62\n  float circleClipOpacity = 1.0 - smoothstep(v_blur, 1.0, fragmengTocenter);\n\n\n  if(v_innerRadius < 0.99) {\n    // \u5F53\u5B58\u5728 stroke \u4E14 stroke > 0.01\n    float blurWidth = (1.0 - v_blur)/2.0;\n    vec4 stroke = vec4(u_stroke_color.rgb, u_stroke_opacity);\n    if(fragmengTocenter > v_innerRadius + blurWidth) {\n      outputColor = stroke;\n    } else if(fragmengTocenter > v_innerRadius - blurWidth){\n      float mixR = (fragmengTocenter - (v_innerRadius - blurWidth)) / (blurWidth * 2.0);\n      outputColor = mix(v_color, stroke, mixR);\n    } else {\n      outputColor = v_color;\n    }\n  } else {\n    // \u5F53\u4E0D\u5B58\u5728 stroke \u6216 stroke <= 0.01\n    outputColor = v_color;\n  }\n\n  outputColor = filterColor(outputColor);\n  \n  if(u_additive > 0.0) {\n    outputColor *= circleClipOpacity;\n  } else {\n    outputColor.a *= circleClipOpacity;\n  }\n\n}\n";
 /* babel-plugin-inline-import '../shaders/billboard/billboard_point_vert.glsl' */
-var simplePointVert = "\nlayout(location = 0) in vec3 a_Position;\nlayout(location = 1) in vec4 a_Color;\nlayout(location = 9) in float a_Size;\n\nlayout(std140) uniform commonUniorm {\n  vec4 u_stroke_color;\n  float u_additive;\n  float u_stroke_opacity;\n  float u_stroke_width;\n};\n\nout vec4 v_color;\nout float v_blur;\nout float v_innerRadius;\n\n#pragma include \"projection\"\n#pragma include \"picking\"\n#pragma include \"project\"\nvoid main() {\n  v_color = vec4(a_Color.xyz, a_Color.w * opacity);\n  v_blur = 1.0 - max(2.0/a_Size, 0.05);\n  v_innerRadius = max((a_Size - u_stroke_width) / a_Size, 0.0);\n  \n  vec2 offset = project_pixel(u_offsets);\n  \n  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n    gl_Position = u_Mvp * vec4(a_Position.xy + offset, a_Position.z, 1.0);\n  } else { // else\n    vec4 project_pos = project_position(vec4(a_Position, 1.0)) + vec4(a_Size / 2.,-a_Size /2.,0.,0.);\n    gl_Position = project_common_position_to_clipspace(vec4(vec2(project_pos.xy+offset),project_pos.z,project_pos.w));\n  }\n  \n  gl_PointSize = a_Size * 2.0 * u_DevicePixelRatio;\n  setPickingColor(a_PickingColor);\n}\n";
+const simplePointVert = "\nlayout(location = 0) in vec3 a_Position;\nlayout(location = 1) in vec4 a_Color;\nlayout(location = 9) in float a_Size;\n\nlayout(std140) uniform commonUniorm {\n  vec4 u_stroke_color;\n  float u_additive;\n  float u_stroke_opacity;\n  float u_stroke_width;\n};\n\nout vec4 v_color;\nout float v_blur;\nout float v_innerRadius;\n\n#pragma include \"projection\"\n#pragma include \"picking\"\n#pragma include \"project\"\nvoid main() {\n  v_color = vec4(a_Color.xyz, a_Color.w * opacity);\n  v_blur = 1.0 - max(2.0/a_Size, 0.05);\n  v_innerRadius = max((a_Size - u_stroke_width) / a_Size, 0.0);\n  \n  vec2 offset = project_pixel(u_offsets);\n  \n  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n    gl_Position = u_Mvp * vec4(a_Position.xy + offset, a_Position.z, 1.0);\n  } else { // else\n    vec4 project_pos = project_position(vec4(a_Position, 1.0)) + vec4(a_Size / 2.,-a_Size /2.,0.,0.);\n    gl_Position = project_common_position_to_clipspace(vec4(vec2(project_pos.xy+offset),project_pos.z,project_pos.w));\n  }\n  \n  gl_PointSize = a_Size * 2.0 * u_DevicePixelRatio;\n  setPickingColor(a_PickingColor);\n}\n";
 export function PointTriangulation(feature) {
-  var coordinates = feature.coordinates;
+  const coordinates = feature.coordinates;
   return {
-    vertices: _toConsumableArray(coordinates),
+    vertices: [...coordinates],
     indices: [0],
     size: coordinates.length
   };
 }
-var SimplePointModel = /*#__PURE__*/function (_BaseModel) {
-  _inherits(SimplePointModel, _BaseModel);
-  var _super = _createSuper(SimplePointModel);
-  function SimplePointModel() {
-    _classCallCheck(this, SimplePointModel);
-    return _super.apply(this, arguments);
+export default class SimplePointModel extends BaseModel {
+  getDefaultStyle() {
+    return {
+      blend: 'additive'
+    };
   }
-  _createClass(SimplePointModel, [{
-    key: "getDefaultStyle",
-    value: function getDefaultStyle() {
-      return {
-        blend: 'additive'
-      };
-    }
-  }, {
-    key: "getCommonUniformsInfo",
-    value: function getCommonUniformsInfo() {
-      var _ref = this.layer.getLayerConfig(),
-        blend = _ref.blend,
-        _ref$strokeOpacity = _ref.strokeOpacity,
-        strokeOpacity = _ref$strokeOpacity === void 0 ? 1 : _ref$strokeOpacity,
-        _ref$strokeWidth = _ref.strokeWidth,
-        strokeWidth = _ref$strokeWidth === void 0 ? 0 : _ref$strokeWidth,
-        _ref$stroke = _ref.stroke,
-        stroke = _ref$stroke === void 0 ? '#fff' : _ref$stroke;
-      var commonOptions = {
-        u_stroke_color: rgb2arr(stroke),
-        u_additive: blend === 'additive' ? 1.0 : 0.0,
-        u_stroke_opacity: strokeOpacity,
-        u_stroke_width: strokeWidth
-      };
-      var commonBufferInfo = this.getUniformsBufferInfo(commonOptions);
-      return commonBufferInfo;
-    }
-  }, {
-    key: "initModels",
-    value: function () {
-      var _initModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) switch (_context.prev = _context.next) {
-            case 0:
-              return _context.abrupt("return", this.buildModels());
-            case 1:
-            case "end":
-              return _context.stop();
-          }
-        }, _callee, this);
-      }));
-      function initModels() {
-        return _initModels.apply(this, arguments);
-      }
-      return initModels;
-    }()
-  }, {
-    key: "buildModels",
-    value: function () {
-      var _buildModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-        var model;
-        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) switch (_context2.prev = _context2.next) {
-            case 0:
-              this.layer.triangulation = PointTriangulation;
-              this.initUniformsBuffer();
-              _context2.next = 4;
-              return this.layer.buildLayerModel({
-                moduleName: 'pointSimple',
-                vertexShader: simplePointVert,
-                fragmentShader: simplePointFrag,
-                inject: this.getInject(),
-                triangulation: PointTriangulation,
-                depth: {
-                  enable: false
-                },
-                primitive: gl.POINTS
-              });
-            case 4:
-              model = _context2.sent;
-              return _context2.abrupt("return", [model]);
-            case 6:
-            case "end":
-              return _context2.stop();
-          }
-        }, _callee2, this);
-      }));
-      function buildModels() {
-        return _buildModels.apply(this, arguments);
-      }
-      return buildModels;
-    }()
-  }, {
-    key: "registerBuiltinAttributes",
-    value: function registerBuiltinAttributes() {
-      this.styleAttributeService.registerStyleAttribute({
-        name: 'size',
-        type: AttributeType.Attribute,
-        descriptor: {
-          name: 'a_Size',
-          shaderLocation: ShaderLocation.SIZE,
-          buffer: {
-            usage: gl.DYNAMIC_DRAW,
-            data: [],
-            type: gl.FLOAT
-          },
-          size: 1,
-          update: function update(feature) {
-            var _feature$size = feature.size,
-              size = _feature$size === void 0 ? 1 : _feature$size;
-            return Array.isArray(size) ? [size[0]] : [size];
-          }
-        }
+  getCommonUniformsInfo() {
+    const {
+      blend,
+      strokeOpacity = 1,
+      strokeWidth = 0,
+      stroke = '#fff'
+    } = this.layer.getLayerConfig();
+    const commonOptions = {
+      u_stroke_color: rgb2arr(stroke),
+      u_additive: blend === 'additive' ? 1.0 : 0.0,
+      u_stroke_opacity: strokeOpacity,
+      u_stroke_width: strokeWidth
+    };
+    const commonBufferInfo = this.getUniformsBufferInfo(commonOptions);
+    return commonBufferInfo;
+  }
+  initModels() {
+    var _this = this;
+    return _asyncToGenerator(function* () {
+      return _this.buildModels();
+    })();
+  }
+  buildModels() {
+    var _this2 = this;
+    return _asyncToGenerator(function* () {
+      _this2.layer.triangulation = PointTriangulation;
+      _this2.initUniformsBuffer();
+      const model = yield _this2.layer.buildLayerModel({
+        moduleName: 'pointSimple',
+        vertexShader: simplePointVert,
+        fragmentShader: simplePointFrag,
+        inject: _this2.getInject(),
+        triangulation: PointTriangulation,
+        depth: {
+          enable: false
+        },
+        primitive: gl.POINTS
       });
-    }
-  }]);
-  return SimplePointModel;
-}(BaseModel);
-export { SimplePointModel as default };
+      return [model];
+    })();
+  }
+  registerBuiltinAttributes() {
+    this.styleAttributeService.registerStyleAttribute({
+      name: 'size',
+      type: AttributeType.Attribute,
+      descriptor: {
+        name: 'a_Size',
+        shaderLocation: ShaderLocation.SIZE,
+        buffer: {
+          usage: gl.DYNAMIC_DRAW,
+          data: [],
+          type: gl.FLOAT
+        },
+        size: 1,
+        update: feature => {
+          const {
+            size = 1
+          } = feature;
+          return Array.isArray(size) ? [size[0]] : [size];
+        }
+      }
+    });
+  }
+}