@antv/l7-layers 2.9.37-alpha.2 → 2.9.37-alpha.3

package/es/line/shaders/linearLine/line_linear_vert.glsl

@@ -0,0 +1,112 @@
+
+attribute float a_Miter;
+attribute vec2 a_Size;
+attribute vec3 a_Normal;
+attribute vec3 a_Position;
+
+// dash line
+attribute float a_Total_Distance;
+attribute vec2 a_DistanceAndIndex;
+
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+
+uniform float u_heightfixed: 0.0;
+uniform float u_vertexScale: 1.0;
+uniform float u_raisingHeight: 0.0;
+
+uniform float u_opacity: 1.0;
+
+#pragma include "projection"
+#pragma include "picking"
+
+varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
+
+#pragma include "styleMapping"
+#pragma include "styleMappingCalOpacity"
+
+void main() {
+  // cal style mapping - 数据纹理映射部分的计算
+  styleMappingMat = mat4(
+    0.0, 0.0, 0.0, 0.0, // opacity - strokeOpacity - strokeWidth - empty
+    0.0, 0.0, 0.0, 0.0, // strokeR - strokeG - strokeB - strokeA
+    0.0, 0.0, 0.0, 0.0, // offsets[0] - offsets[1]
+    0.0, 0.0, 0.0, 0.0  // distance_ratio/distance/pixelLen/texV
+  );
+
+  float rowCount = u_cellTypeLayout[0][0];    // 当前的数据纹理有几行
+  float columnCount = u_cellTypeLayout[0][1]; // 当看到数据纹理有几列
+  float columnWidth = 1.0/columnCount;  // 列宽
+  float rowHeight = 1.0/rowCount;       // 行高
+  float cellCount = calCellCount(); // opacity - strokeOpacity - strokeWidth - stroke - offsets
+  float id = a_vertexId; // 第n个顶点
+  float cellCurrentRow = floor(id * cellCount / columnCount) + 1.0; // 起始点在第几行
+  float cellCurrentColumn = mod(id * cellCount, columnCount) + 1.0; // 起始点在第几列
+  
+  // cell 固定顺序 opacity -> strokeOpacity -> strokeWidth -> stroke ... 
+  // 按顺序从 cell 中取值、若没有则自动往下取值
+  float textureOffset = 0.0; // 在 cell 中取值的偏移量
+
+  vec2 opacityAndOffset = calOpacityAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);
+  styleMappingMat[0][0] = opacityAndOffset.r;
+  textureOffset = opacityAndOffset.g;
+  // cal style mapping - 数据纹理映射部分的计算
+
+  vec3 size = a_Miter * setPickingSize(a_Size.x) * reverse_offset_normal(a_Normal);
+  
+  vec2 offset = project_pixel(size.xy);
+
+  float lineDistance = a_DistanceAndIndex.x;
+  float currentLinePointRatio = lineDistance / a_Total_Distance;
+ 
+
+  float lineOffsetWidth = length(offset + offset * sign(a_Miter)); // 线横向偏移的距离（向两侧偏移的和）
+  float linePixelSize = project_pixel(a_Size.x) * 2.0;  // 定点位置偏移，按地图等级缩放后的距离 单侧 * 2
+  float texV = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值
+
+  // 设置数据集的参数
+  styleMappingMat[3][0] = currentLinePointRatio; // 当前点位距离占线总长的比例
+  styleMappingMat[3][3] = texV;             // 线图层贴图部分的 v 坐标值
+
+  vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
+
+  // gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy + offset, a_Size.y, 1.0));
+
+  float h = float(a_Position.z) * u_vertexScale; // 线顶点的高度 - 兼容不存在第三个数值的情况 vertex height
+  float lineHeight = a_Size.y; // size 第二个参数代表的高度 [linewidth, lineheight]
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    lineHeight *= 0.2; // 保持和 amap/mapbox 一致的效果
+    h *= 0.2;
+    if(u_heightfixed < 1.0) {
+      lineHeight = project_pixel(a_Size.y);
+    }
+    gl_Position = u_Mvp * (vec4(project_pos.xy + offset, lineHeight + h + u_raisingHeight, 1.0));
+  } else {
+    // mapbox -  amap
+    
+    // 兼容 mapbox 在线高度上的效果表现基本一致
+    if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {
+      // mapbox
+      // 保持高度相对不变
+      float mapboxZoomScale = 4.0/pow(2.0, 21.0 - u_Zoom);
+      h *= mapboxZoomScale;
+      h += u_raisingHeight * mapboxZoomScale;
+      if(u_heightfixed > 0.0) {
+        lineHeight *= mapboxZoomScale;
+      }
+      
+    } else {
+      // amap
+      h += u_raisingHeight;
+      // lineHeight 顶点偏移高度
+      if(u_heightfixed < 1.0) {
+        lineHeight *= pow(2.0, 20.0 - u_Zoom);
+      }
+    }
+
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy + offset, lineHeight + h, 1.0));
+  }
+
+  setPickingColor(a_PickingColor);
+}

package/es/line/shaders/simple/simpleline_frag.glsl

@@ -0,0 +1,10 @@
+
+varying vec4 v_color;
+varying mat4 styleMappingMat;
+void main() {
+  float opacity = styleMappingMat[0][0];
+  float d_distance_ratio = styleMappingMat[3].r; // 当前点位距离占线总长的比例
+
+  gl_FragColor = v_color;
+  gl_FragColor.a *= opacity; // 全局透明度
+}

package/es/line/shaders/simple/simpleline_linear_frag.glsl

@@ -0,0 +1,11 @@
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
+
+varying mat4 styleMappingMat;
+void main() {
+  float opacity = styleMappingMat[0][0];
+
+  // styleMappingMat[3][0] 当前点位距离占线总长的比例
+  gl_FragColor = mix(u_sourceColor, u_targetColor, styleMappingMat[3][0]);
+  gl_FragColor.a *= opacity; // 全局透明度
+}

package/es/line/shaders/simple/simpleline_vert.glsl

@@ -0,0 +1,79 @@
+attribute vec4 a_Color;
+attribute vec2 a_Size;
+attribute vec3 a_Position;
+
+attribute float a_Total_Distance;
+attribute float a_Distance;
+
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+
+uniform float u_opacity: 1.0;
+uniform float u_vertexScale: 1.0;
+
+#pragma include "projection"
+
+varying vec4 v_color;
+
+varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
+
+#pragma include "styleMapping"
+#pragma include "styleMappingCalOpacity"
+
+void main() {
+  // cal style mapping - 数据纹理映射部分的计算
+  styleMappingMat = mat4(
+    0.0, 0.0, 0.0, 0.0, // opacity - strokeOpacity - strokeWidth - empty
+    0.0, 0.0, 0.0, 0.0, // strokeR - strokeG - strokeB - strokeA
+    0.0, 0.0, 0.0, 0.0, // offsets[0] - offsets[1]
+    0.0, 0.0, 0.0, 0.0  // distance_ratio/distance/pixelLen/texV
+  );
+
+  float rowCount = u_cellTypeLayout[0][0];    // 当前的数据纹理有几行
+  float columnCount = u_cellTypeLayout[0][1]; // 当看到数据纹理有几列
+  float columnWidth = 1.0/columnCount;  // 列宽
+  float rowHeight = 1.0/rowCount;       // 行高
+  float cellCount = calCellCount(); // opacity - strokeOpacity - strokeWidth - stroke - offsets
+  float id = a_vertexId; // 第n个顶点
+  float cellCurrentRow = floor(id * cellCount / columnCount) + 1.0; // 起始点在第几行
+  float cellCurrentColumn = mod(id * cellCount, columnCount) + 1.0; // 起始点在第几列
+  
+  // cell 固定顺序 opacity -> strokeOpacity -> strokeWidth -> stroke ... 
+  // 按顺序从 cell 中取值、若没有则自动往下取值
+  float textureOffset = 0.0; // 在 cell 中取值的偏移量
+
+  vec2 opacityAndOffset = calOpacityAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);
+  styleMappingMat[0][0] = opacityAndOffset.r;
+  textureOffset = opacityAndOffset.g;
+  // cal style mapping - 数据纹理映射部分的计算
+
+  
+  v_color = a_Color; 
+  styleMappingMat[3][0] = a_Distance / a_Total_Distance;
+
+  vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
+
+  float h = float(a_Position.z) * u_vertexScale; // 线顶点的高度 - 兼容不存在第三个数值的情况
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    gl_Position = u_Mvp * (vec4(project_pos.xy, project_pixel(a_Size.y) + h * 0.2, 1.0));
+  } else {
+    float lineHeight = a_Size.y;
+    // 兼容 mapbox 在线高度上的效果表现基本一致
+    if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {
+      // 保持高度相对不变
+      h *= 2.0/pow(2.0, 20.0 - u_Zoom);
+    }
+
+    // #define COORDINATE_SYSTEM_P20 5.0
+    // #define COORDINATE_SYSTEM_P20_OFFSET 6.0
+    // amap1.x
+    if(u_CoordinateSystem == COORDINATE_SYSTEM_P20 || u_CoordinateSystem == COORDINATE_SYSTEM_P20_OFFSET) {
+      // 保持高度相对不变
+      lineHeight *= pow(2.0, 20.0 - u_Zoom);
+    }
+
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy, lineHeight + h, 1.0));
+    gl_PointSize = 10.0;
+  }
+}

package/es/line/shaders/tile/line_tile_map_vert.glsl

@@ -0,0 +1,25 @@
+attribute float a_Miter;
+attribute vec4 a_Color;
+attribute vec3 a_Normal;
+attribute vec3 a_Position;
+
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+uniform float u_size;
+
+#pragma include "projection"
+
+void main() {
+
+  vec3 size = a_Miter * u_size * reverse_offset_normal(a_Normal);
+  
+  vec2 offset = project_pixel(size.xy);
+
+  vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    gl_Position = u_Mvp * (vec4(project_pos.xy + offset, 0.0, 1.0));
+  } else {
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy + offset, 0.0, 1.0));
+  }
+}

package/es/line/shaders/tile/line_tile_vert.glsl

@@ -0,0 +1,52 @@
+attribute float a_Miter;
+attribute vec4 a_Color;
+attribute vec2 a_Size;
+attribute vec3 a_Normal;
+attribute vec3 a_Position;
+
+// uniform vec2 u_tileOrigin;
+// uniform float u_coord;
+
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+
+
+#pragma include "projection"
+#pragma include "picking"
+
+varying vec4 v_color;
+
+void main() {
+  v_color = a_Color;
+
+  vec3 size = a_Miter * setPickingSize(a_Size.x) * reverse_offset_normal(a_Normal);
+  
+  vec2 offset = project_pixel(size.xy);
+
+  vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
+
+  // if(u_coord > 0.0) { // 使用经纬度坐标
+      if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+      gl_Position = u_Mvp * (vec4(project_pos.xy + offset, 0.0, 1.0));
+    } else {
+      gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy + offset, 0.0, 1.0));
+    }
+  // } else { // 使用偏移坐标
+  //   vec2 pointPos = a_Position.xy;
+  //   vec4 tileWorld = vec4(project_mvt_offset_position(vec4(u_tileOrigin, 0.0, 1.0)).xyz, 1.0); // 瓦片起始点的世界坐标
+
+  //   vec2 pointOffset =  pointPos *  pow(2.0, u_Zoom); // 瓦片内的点的偏移坐标
+    
+  //   tileWorld.xy += pointOffset;
+
+  //   tileWorld.xy += offset;
+
+  //   if (u_CoordinateSystem == COORDINATE_SYSTEM_METER_OFFSET || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {
+  //     // Needs to be divided with project_uCommonUnitsPerMeter
+  //     tileWorld.w *= u_PixelsPerMeter.z;
+  //   }
+  //   gl_Position = u_ViewProjectionMatrix * tileWorld + u_ViewportCenterProjection;
+  // }
+
+  setPickingColor(a_PickingColor);
+}

package/es/line/shaders/tile/simpleline_map_vert.glsl

@@ -0,0 +1,15 @@
+attribute vec3 a_Position;
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+
+#pragma include "projection"
+
+void main() {
+  vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    gl_Position = u_Mvp * (vec4(project_pos.xy, 0.0, 1.0));
+  } else {
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy, 0.0, 1.0));
+  }
+}

package/es/line/shaders/tile/simpleline_vert.glsl

@@ -0,0 +1,21 @@
+attribute vec4 a_Color;
+attribute vec3 a_Position;
+
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+
+#pragma include "projection"
+
+varying vec4 v_color;
+
+void main() {
+  v_color = a_Color; 
+
+  vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    gl_Position = u_Mvp * (vec4(project_pos.xy, 0.0, 1.0));
+  } else {
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy, 0.0, 1.0));
+  }
+}

package/es/line/shaders/wall/wall_frag.glsl

@@ -0,0 +1,89 @@
+#define Animate 0.0
+#define LineTexture 1.0
+
+// line texture
+uniform float u_line_texture;
+uniform sampler2D u_texture;
+uniform vec2 u_textSize;
+uniform float u_linearColor: 0;
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
+uniform float u_opacity : 1.0;
+uniform float u_textureBlend;
+uniform float u_iconStepCount;
+uniform float u_time;
+uniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ]; // 控制运动
+
+varying vec2 v_iconMapUV;
+varying float v_blur;
+varying float v_radio;
+varying vec4 v_color;
+varying vec4 v_dataset;
+
+#pragma include "picking"
+
+void main() {
+  float opacity = u_opacity;
+  float animateSpeed = 0.0; // 运动速度
+  float d_distance_ratio = v_dataset.r; // 当前点位距离占线总长的比例
+  float v = v_dataset.a;
+
+  if(u_linearColor == 1.0) { // 使用渐变颜色
+    gl_FragColor = mix(u_sourceColor, u_targetColor, v);
+  } else { // 使用 color 方法传入的颜色
+     gl_FragColor = v_color;
+  }
+
+  gl_FragColor.a *= opacity; // 全局透明度
+  if(u_animate.x == Animate) {
+      animateSpeed = u_time / u_animate.y;
+       float alpha =1.0 - fract( mod(1.0- d_distance_ratio, u_animate.z)* (1.0/ u_animate.z) + animateSpeed);
+      alpha = (alpha + u_animate.w -1.0) / u_animate.w;
+      alpha = smoothstep(0., 1., alpha);
+      gl_FragColor.a *= alpha;
+  }
+
+  if(u_line_texture == LineTexture) { // while load texture
+    float aDistance = v_dataset.g;      // 当前顶点的距离
+    float d_texPixelLen = v_dataset.b;  // 贴图的像素长度，根据地图层级缩放
+    float u = fract(mod(aDistance, d_texPixelLen)/d_texPixelLen - animateSpeed);
+    float v = v_dataset.a;  // 线图层贴图部分的 v 坐标值
+
+    // 计算纹理间隔 start
+    float flag = 0.0;
+    if(u > 1.0/u_iconStepCount) {
+      flag = 1.0;
+    }
+    u = fract(u*u_iconStepCount);
+    // 计算纹理间隔 end
+
+    vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.;
+    vec4 pattern = texture2D(u_texture, uv);
+
+    // Tip: 判断纹理间隔
+    if(flag > 0.0) {
+      pattern = vec4(0.0);
+    }
+
+    if(u_textureBlend == 0.0) { // normal
+      pattern.a = 0.0;
+      gl_FragColor = filterColor(gl_FragColor + pattern);
+    } else { // replace
+        pattern.a *= opacity;
+        if(gl_FragColor.a <= 0.0) {
+          pattern.a = 0.0;
+        }
+        gl_FragColor = filterColor(pattern);
+    }
+  }
+  
+
+  // blur - AA
+  if(v < v_blur) {
+    gl_FragColor.a = mix(0.0, gl_FragColor.a, v/v_blur);
+  } else if(v > 1.0 - v_blur) {
+    gl_FragColor.a = mix(gl_FragColor.a, 0.0, (v - (1.0 - v_blur))/v_blur);
+  }
+
+  gl_FragColor = filterColor(gl_FragColor);
+}

package/es/line/shaders/wall/wall_vert.glsl

@@ -0,0 +1,77 @@
+#define Animate 0.0
+
+attribute float a_Miter;
+attribute vec4 a_Color;
+attribute vec2 a_Size;
+attribute vec3 a_Normal;
+attribute vec3 a_Position;
+attribute vec2 a_iconMapUV;
+attribute float a_Total_Distance;
+attribute float a_Distance;
+
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+uniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];
+uniform float u_icon_step: 100;
+uniform float u_heightfixed;
+uniform float u_linearColor: 0;
+
+#pragma include "projection"
+#pragma include "light"
+#pragma include "picking"
+
+// texV 线图层 - 贴图部分的 v 坐标（线的宽度方向）
+varying vec2 v_iconMapUV;
+varying vec4 v_color;
+varying float v_blur;
+varying float v_radio;
+varying vec4 v_dataset;
+
+void main() {
+
+
+  float d_distance_ratio; // 当前点位距离占线总长的比例
+  float d_texPixelLen;    // 贴图的像素长度，根据地图层级缩放
+
+  v_iconMapUV = a_iconMapUV;
+  if(u_heightfixed < 1.0) {     // 高度随 zoom 调整
+    d_texPixelLen = project_pixel(u_icon_step);
+  } else {
+    d_texPixelLen = u_icon_step;
+  }
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) {
+    d_texPixelLen *= 10.0;
+  }
+
+  if(u_animate.x == Animate || u_linearColor == 1.0) {
+      d_distance_ratio = a_Distance / a_Total_Distance;
+  }
+
+  float miter = (a_Miter + 1.0)/2.0;
+  // 设置数据集的参数
+  v_dataset[0] = d_distance_ratio; // 当前点位距离占线总长的比例
+  v_dataset[1] = a_Distance;       // 当前顶点的距离
+  v_dataset[2] = d_texPixelLen;    // 贴图的像素长度，根据地图层级缩放
+  v_dataset[3] = miter;          // 线图层贴图部分的 v 坐标值 0 - 1
+
+  vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
+
+  float originSize = a_Size.x;  // 固定高度
+  if(u_heightfixed < 1.0) {     // 高度随 zoom 调整
+    originSize = project_float_pixel(a_Size.x);
+  }
+
+  float wallHeight = originSize * miter;
+  float lightWeight = calc_lighting(vec4(project_pos.xy, wallHeight, 1.0));
+
+  v_blur = min(project_float_pixel(2.0) / originSize, 0.05);
+  v_color = vec4(a_Color.rgb * lightWeight, a_Color.w);
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    gl_Position = u_Mvp * (vec4(project_pos.xy, wallHeight, 1.0));
+  } else {
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy, wallHeight, 1.0));
+  }
+
+  setPickingColor(a_PickingColor);
+}

package/es/mask/index.d.ts

@@ -0,0 +1,18 @@
+import BaseLayer from '../core/BaseLayer';
+import { IMaskLayerStyleOptions } from '../core/interface';
+import { MaskModelType } from './models';
+export default class MaskLayer extends BaseLayer<IMaskLayerStyleOptions> {
+    type: string;
+    defaultSourceConfig: {
+        data: [];
+        options: {
+            parser: {
+                type: 'geojson';
+            };
+        };
+    };
+    init(): this;
+    buildModels(): void;
+    rebuildModels(): void;
+    protected getModelType(): MaskModelType;
+}

package/es/mask/index.js

@@ -0,0 +1,147 @@
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/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; }
+
+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 MaskModels from "./models";
+import { isVectorTile } from "../tile/utils";
+import { TYPES } from '@antv/l7-core';
+
+var MaskLayer = /*#__PURE__*/function (_BaseLayer) {
+  _inherits(MaskLayer, _BaseLayer);
+
+  var _super = _createSuper(MaskLayer);
+
+  function MaskLayer() {
+    var _this;
+
+    _classCallCheck(this, MaskLayer);
+
+    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", 'MaskLayer');
+
+    return _this;
+  }
+
+  _createClass(MaskLayer, [{
+    key: "init",
+    value: function init() {
+      var _this2 = this;
+
+      // 设置配置项
+      var sceneId = this.container.get(TYPES.SceneID);
+      this.configService.setLayerConfig(sceneId, this.id, this.rawConfig);
+      this.layerType = this.rawConfig.layerType;
+      this.rendererService = this.container.get(TYPES.IRendererService);
+      this.layerService = this.container.get(TYPES.ILayerService);
+      this.mapService = this.container.get(TYPES.IMapService);
+      this.cameraService = this.container.get(TYPES.ICameraService);
+      this.coordinateService = this.container.get(TYPES.ICoordinateSystemService);
+      this.shaderModuleService = this.container.get(TYPES.IShaderModuleService);
+      this.postProcessingPassFactory = this.container.get(TYPES.IFactoryPostProcessingPass);
+      this.normalPassFactory = this.container.get(TYPES.IFactoryNormalPass); // 图层容器服务
+
+      this.styleAttributeService = this.container.get(TYPES.IStyleAttributeService); // 完成样式服务注册完成前添加的属性
+
+      this.pendingStyleAttributes.forEach(function (_ref) {
+        var attributeName = _ref.attributeName,
+            attributeField = _ref.attributeField,
+            attributeValues = _ref.attributeValues,
+            updateOptions = _ref.updateOptions;
+
+        _this2.styleAttributeService.updateStyleAttribute(attributeName, {
+          // @ts-ignore
+          scale: _objectSpread({
+            field: attributeField
+          }, _this2.splitValuesAndCallbackInAttribute( // @ts-ignore
+          attributeValues, // @ts-ignore
+          _this2.getLayerConfig()[attributeName]))
+        }, // @ts-ignore
+        updateOptions);
+      });
+      this.pendingStyleAttributes = []; // 获取插件集
+
+      this.plugins = this.container.getAll(TYPES.ILayerPlugin); // 完成插件注册，传入场景和图层容器内的服务
+
+      var _iterator = _createForOfIteratorHelper(this.plugins),
+          _step;
+
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var plugin = _step.value;
+          plugin.apply(this, {
+            rendererService: this.rendererService,
+            mapService: this.mapService,
+            styleAttributeService: this.styleAttributeService,
+            normalPassFactory: this.normalPassFactory,
+            postProcessingPassFactory: this.postProcessingPassFactory
+          });
+        } // 触发 init 生命周期插件
+
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+
+      this.hooks.init.call();
+      this.hooks.afterInit.call();
+      return this;
+    }
+  }, {
+    key: "buildModels",
+    value: function buildModels() {
+      var _this3 = this;
+
+      var shape = this.getModelType();
+      this.layerModel = new MaskModels[shape](this);
+      this.layerModel.initModels(function (models) {
+        _this3.dispatchModelLoad(models);
+      });
+    }
+  }, {
+    key: "rebuildModels",
+    value: function rebuildModels() {
+      var _this4 = this;
+
+      this.layerModel.buildModels(function (models) {
+        _this4.dispatchModelLoad(models);
+      });
+    }
+  }, {
+    key: "getModelType",
+    value: function getModelType() {
+      var parserType = this.layerSource.getParserType();
+
+      if (isVectorTile(parserType)) {
+        return 'vectorMask';
+      }
+
+      return 'fill';
+    }
+  }]);
+
+  return MaskLayer;
+}(BaseLayer);
+
+export { MaskLayer as default };

package/es/mask/models/fill.d.ts

@@ -0,0 +1,12 @@
+import { IModel } from '@antv/l7-core';
+import BaseModel from '../../core/BaseModel';
+export default class MaskModel extends BaseModel {
+    getUninforms(): {
+        u_opacity: number;
+        u_color: number[];
+    };
+    initModels(callbackModel: (models: IModel[]) => void): void;
+    buildModels(callbackModel: (models: IModel[]) => void): Promise<void>;
+    clearModels(refresh?: boolean): void;
+    protected registerBuiltinAttributes(): string;
+}