@antv/l7-layers 2.9.32-alpha.3 → 2.9.32-alpha.4

package/es/polygon/models/water.js

@@ -0,0 +1,179 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
+import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+
+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 { Version } from '@antv/l7-maps';
+import { getMask } from '@antv/l7-utils';
+import { isNumber } from 'lodash';
+import BaseModel from "../../core/BaseModel";
+import { polygonTriangulation } from "../../core/triangulation";
+
+/* babel-plugin-inline-import '../shaders/water/polygon_water_frag.glsl' */
+var water_frag = "uniform sampler2D u_texture;\nuniform float u_time: 0.0;\nuniform float u_speed: 1.0;\nuniform float u_opacity: 1.0;\n\nvarying vec4 v_Color;\nvarying vec2 v_uv;\n\nfloat rand(vec2 n) { return 0.5 + 0.5 * fract(sin(dot(n.xy, vec2(12.9898, 78.233)))* 43758.5453); }\n\nfloat water(vec3 p) {\n  float t = u_time * u_speed;\n  p.z += t * 2.; p.x += t * 2.;\n  vec3 c1 = texture2D(u_texture, p.xz / 30.).xyz;\n  p.z += t * 3.; p.x += t * 0.52;\n  vec3 c2 = texture2D(u_texture, p.xz / 30.).xyz;\n  p.z += t * 4.; p.x += t * 0.8;\n  vec3 c3 = texture2D(u_texture, p.xz / 30.).xyz;\n  c1 += c2 - c3;\n  float z = (c1.x + c1.y + c1.z) / 3.;\n  return p.y + z / 4.;\n}\n\nfloat map(vec3 p) {\n  float d = 100.0;\n  d = water(p);\n  return d;\n}\n\nfloat intersect(vec3 ro, vec3 rd) {\n  float d = 0.0;\n  for (int i = 0; i <= 100; i++) {\n    float h = map(ro + rd * d);\n    if (h < 0.1) return  d;\n    d += h;\n  }\n  return 0.0;\n}\n\nvec3 norm(vec3 p) {\n  float eps = .1;\n  return normalize(vec3(\n    map(p + vec3(eps, 0, 0)) - map(p + vec3(-eps, 0, 0)),\n    map(p + vec3(0, eps, 0)) - map(p + vec3(0, -eps, 0)),\n    map(p + vec3(0, 0, eps)) - map(p + vec3(0, 0, -eps))\n  ));\n} \n\nfloat calSpc() {\n  vec3 l1 = normalize(vec3(1, 1, 1));\n  vec3 ro = vec3(-3, 20, -8);\n  vec3 rc = vec3(0, 0, 0);\n  vec3 ww = normalize(rc - ro);\n  vec3 uu = normalize(cross(vec3(0,1,0), ww));\n  vec3 vv = normalize(cross(rc - ro, uu));\n  vec3 rd = normalize(uu * v_uv.x + vv * v_uv.y + ww);\n  float d = intersect(ro, rd);\n  vec3 p = ro + rd * d;\n  vec3 n = norm(p);\n  float spc = pow(max(0.0, dot(reflect(l1, n), rd)), 30.0);\n  return spc;\n}\n\nvoid main() {\n  float opacity = u_opacity;\n  gl_FragColor = v_Color;\n  gl_FragColor.a *= opacity;\n\n  float spc = calSpc();\n  gl_FragColor += spc * 0.4;\n}\n";
+
+/* babel-plugin-inline-import '../shaders/water/polygon_water_vert.glsl' */
+var water_vert = "attribute vec4 a_Color;\nattribute vec2 a_uv;\nattribute vec3 a_Position;\nuniform mat4 u_ModelMatrix;\nuniform mat4 u_Mvp;\n\nvarying vec4 v_Color;\nvarying vec2 v_uv;\nuniform float u_opacity: 1.0;\n\n\n#pragma include \"projection\"\n\nvoid main() {\n  v_uv = a_uv;\n\n  v_Color = a_Color;\n  vec4 project_pos = project_position(vec4(a_Position, 1.0));\n\n  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n    gl_Position = u_Mvp * (vec4(project_pos.xyz, 1.0));\n  } else {\n    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));\n  }\n}\n\n";
+
+var WaterModel = /*#__PURE__*/function (_BaseModel) {
+  _inherits(WaterModel, _BaseModel);
+
+  var _super = _createSuper(WaterModel);
+
+  function WaterModel() {
+    _classCallCheck(this, WaterModel);
+
+    return _super.apply(this, arguments);
+  }
+
+  _createClass(WaterModel, [{
+    key: "getUninforms",
+    value: function getUninforms() {
+      var _ref = this.layer.getLayerConfig(),
+          _ref$opacity = _ref.opacity,
+          opacity = _ref$opacity === void 0 ? 1 : _ref$opacity,
+          _ref$speed = _ref.speed,
+          speed = _ref$speed === void 0 ? 0.5 : _ref$speed;
+
+      return {
+        u_texture: this.texture,
+        u_speed: speed,
+        u_opacity: isNumber(opacity) ? opacity : 1.0
+      };
+    }
+  }, {
+    key: "getAnimateUniforms",
+    value: function getAnimateUniforms() {
+      return {
+        u_time: this.layer.getLayerAnimateTime()
+      };
+    }
+  }, {
+    key: "initModels",
+    value: function initModels(callbackModel) {
+      this.loadTexture();
+      this.buildModels(callbackModel);
+    }
+  }, {
+    key: "buildModels",
+    value: function buildModels(callbackModel) {
+      var _ref2 = this.layer.getLayerConfig(),
+          _ref2$mask = _ref2.mask,
+          mask = _ref2$mask === void 0 ? false : _ref2$mask,
+          _ref2$maskInside = _ref2.maskInside,
+          maskInside = _ref2$maskInside === void 0 ? true : _ref2$maskInside;
+
+      this.layer.buildLayerModel({
+        moduleName: 'polygonWater',
+        vertexShader: water_vert,
+        fragmentShader: water_frag,
+        triangulation: polygonTriangulation,
+        primitive: gl.TRIANGLES,
+        depth: {
+          enable: false
+        },
+        stencil: getMask(mask, maskInside),
+        pick: false
+      }).then(function (model) {
+        callbackModel([model]);
+      }).catch(function (err) {
+        console.warn(err);
+        callbackModel([]);
+      });
+    }
+  }, {
+    key: "clearModels",
+    value: function clearModels() {
+      var _this$texture;
+
+      (_this$texture = this.texture) === null || _this$texture === void 0 ? void 0 : _this$texture.destroy();
+    }
+  }, {
+    key: "registerBuiltinAttributes",
+    value: function registerBuiltinAttributes() {
+      var bbox = this.layer.getSource().extent;
+
+      var _bbox = _slicedToArray(bbox, 4),
+          minLng = _bbox[0],
+          minLat = _bbox[1],
+          maxLng = _bbox[2],
+          maxLat = _bbox[3];
+
+      var lngLen = maxLng - minLng;
+      var latLen = maxLat - minLat;
+      this.styleAttributeService.registerStyleAttribute({
+        name: 'waterUv',
+        type: AttributeType.Attribute,
+        descriptor: {
+          name: 'a_uv',
+          buffer: {
+            // give the WebGL driver a hint that this buffer may change
+            usage: gl.STATIC_DRAW,
+            data: [],
+            type: gl.FLOAT
+          },
+          size: 2,
+          update: function update(feature, featureIdx, vertex, attributeIdx) {
+            var v = feature.version === Version['GAODE2.x'] ? feature.originCoordinates[0][attributeIdx] : vertex;
+
+            var _v = _slicedToArray(v, 2),
+                lng = _v[0],
+                lat = _v[1];
+
+            return [(lng - minLng) / lngLen, (lat - minLat) / latLen];
+          }
+        }
+      });
+    }
+  }, {
+    key: "loadTexture",
+    value: function loadTexture() {
+      var _this = this;
+
+      var _ref3 = this.layer.getLayerConfig(),
+          waterTexture = _ref3.waterTexture;
+
+      var createTexture2D = this.rendererService.createTexture2D;
+      this.texture = createTexture2D({
+        height: 0,
+        width: 0
+      });
+      var image = new Image();
+      image.crossOrigin = '';
+
+      if (waterTexture) {
+        // custom texture
+        console.warn('L7 recommend：https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*EojwT4VzSiYAAAAAAAAAAAAAARQnAQ');
+        image.src = waterTexture;
+      } else {
+        // default texture
+        image.src = 'https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*EojwT4VzSiYAAAAAAAAAAAAAARQnAQ';
+      }
+
+      image.onload = function () {
+        _this.texture = createTexture2D({
+          data: image,
+          width: image.width,
+          height: image.height,
+          wrapS: gl.MIRRORED_REPEAT,
+          wrapT: gl.MIRRORED_REPEAT,
+          min: gl.LINEAR,
+          mag: gl.LINEAR
+        });
+
+        _this.layerService.reRender();
+      };
+    }
+  }]);
+
+  return WaterModel;
+}(BaseModel);
+
+export { WaterModel as default };

package/es/polygon/shaders/extrude/polygon_extrude_frag.glsl

@@ -0,0 +1,44 @@
+uniform float u_opacity: 1.0;
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
+uniform float u_linearColor: 0;
+
+uniform float u_topsurface: 1.0;
+uniform float u_sidesurface: 1.0;
+
+varying vec4 v_Color;
+varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
+#pragma include "picking"
+
+void main() {
+  float opacity = styleMappingMat[0][0];  
+  float isSide = styleMappingMat[0][3];
+  float sidey = styleMappingMat[3][0];
+  float lightWeight = styleMappingMat[3][1];
+
+  if(isSide < 1.0) {
+    // side face
+    if(u_sidesurface < 1.0) {
+      discard;
+    }
+
+    if(u_linearColor == 1.0) {
+      vec4 linearColor = mix(u_targetColor, u_sourceColor, sidey);
+      linearColor.rgb *= lightWeight;
+      gl_FragColor = linearColor;
+    } else {
+      gl_FragColor = v_Color;
+    }
+
+  } else {
+     // top face
+    if(u_topsurface < 1.0) {
+      discard;
+    }
+
+    gl_FragColor = v_Color;
+  }
+
+  gl_FragColor.a *= opacity;
+  gl_FragColor = filterColor(gl_FragColor);
+}

package/es/polygon/shaders/extrude/polygon_extrude_picklight_frag.glsl

@@ -0,0 +1,44 @@
+uniform float u_opacity: 1.0;
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
+uniform float u_linearColor: 0;
+
+uniform float u_topsurface: 1.0;
+uniform float u_sidesurface: 1.0;
+
+varying vec4 v_Color;
+varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
+#pragma include "picking"
+
+void main() {
+  float opacity = styleMappingMat[0][0];
+  float isSide = styleMappingMat[0][3];
+  float sidey = styleMappingMat[3][0];
+  float lightWeight = styleMappingMat[3][1];
+
+  if(isSide < 1.0) {
+    // side face
+    if(u_sidesurface < 1.0) {
+      discard;
+    }
+    
+    if( u_linearColor == 1.0) {
+      // side use linear
+      vec4 linearColor = mix(u_targetColor, u_sourceColor, sidey);
+      linearColor.rgb *= lightWeight;
+      gl_FragColor = linearColor;
+    } else {
+      // side notuse linear
+       gl_FragColor = v_Color;
+    }
+  } else {
+    // top face
+    if(u_topsurface < 1.0) {
+      discard;
+    }
+    gl_FragColor = v_Color;
+  }
+
+  gl_FragColor.a *= opacity;
+  gl_FragColor = filterColorAlpha(gl_FragColor, lightWeight);
+}

package/es/polygon/shaders/extrude/polygon_extrude_picklight_vert.glsl

@@ -0,0 +1,85 @@
+precision highp float;
+
+#define ambientRatio 0.5
+#define diffuseRatio 0.3
+#define specularRatio 0.2
+
+attribute vec4 a_Color;
+attribute vec3 a_Position;
+attribute vec3 a_Normal;
+attribute float a_Size;
+attribute vec3 a_uvs;
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+
+varying vec4 v_Color;
+uniform float u_heightfixed: 0.0; // 默认不固定
+uniform float u_raisingHeight: 0.0;
+uniform float u_opacity: 1.0;
+varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
+
+#pragma include "styleMapping"
+#pragma include "styleMappingCalOpacity"
+
+#pragma include "projection"
+#pragma include "light"
+#pragma include "picking"
+
+void main() {
+  // cal style mapping - 数据纹理映射部分的计算
+  styleMappingMat = mat4(
+    0.0, 0.0, 0.0, 0.0, // opacity - strokeOpacity - strokeWidth - isSide
+    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  // sidey
+  );
+  styleMappingMat[0][3] = a_Position.z;
+  styleMappingMat[3][0] = a_uvs[2];
+
+  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 - 数据纹理映射部分的计算
+  vec4 pos = vec4(a_Position.xy, a_Position.z * a_Size, 1.0);
+  vec4 project_pos = project_position(pos);
+
+  if(u_heightfixed > 0.0) { // 判断几何体是否固定高度
+    project_pos.z = a_Position.z * a_Size;
+    project_pos.z += u_raisingHeight;
+    if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {
+      float mapboxZoomScale = 4.0/pow(2.0, 21.0 - u_Zoom);
+      project_pos.z *= mapboxZoomScale;
+      project_pos.z += u_raisingHeight * mapboxZoomScale;
+    }
+  }
+
+  // gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    // gl_Position = u_Mvp * (vec4(project_pos.xyz * vec3(1.0, 1.0, -1.0), 1.0));
+    gl_Position = u_Mvp * (vec4(project_pos.xyz, 1.0));
+  } else {
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));
+  }
+
+  float lightWeight = calc_lighting(pos);
+  // v_Color = a_Color;
+  v_Color = vec4(a_Color.rgb * lightWeight, a_Color.w);
+
+  styleMappingMat[3][1] = lightWeight;
+
+  setPickingColor(a_PickingColor);
+}

package/es/polygon/shaders/extrude/polygon_extrude_vert.glsl

@@ -0,0 +1,90 @@
+precision highp float;
+
+#define ambientRatio 0.5
+#define diffuseRatio 0.3
+#define specularRatio 0.2
+
+attribute vec4 a_Color;
+attribute vec3 a_Position;
+attribute vec3 a_Normal;
+attribute float a_Size;
+attribute vec3 a_uvs;
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+
+varying vec4 v_Color;
+uniform float u_heightfixed: 0.0; // 默认不固定
+uniform float u_raisingHeight: 0.0;
+uniform float u_opacity: 1.0;
+varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
+
+#pragma include "styleMapping"
+#pragma include "styleMappingCalOpacity"
+
+#pragma include "projection"
+#pragma include "light"
+#pragma include "picking"
+
+void main() {
+  // cal style mapping - 数据纹理映射部分的计算
+  styleMappingMat = mat4(
+    0.0, 0.0, 0.0, 0.0, // opacity - strokeOpacity - strokeWidth - isSide
+    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  // sidey
+  );
+  styleMappingMat[0][3] = a_Position.z;
+  styleMappingMat[3][0] = a_uvs[2];
+
+  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 - 数据纹理映射部分的计算
+
+  vec4 pos = vec4(a_Position.xy, a_Position.z * a_Size, 1.0);
+  vec4 project_pos = project_position(pos);
+
+  if(u_heightfixed > 0.0) { // 判断几何体是否固定高度
+    project_pos.z = a_Position.z * a_Size;
+    project_pos.z += u_raisingHeight;
+
+    if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {
+      float mapboxZoomScale = 4.0/pow(2.0, 21.0 - u_Zoom);
+      project_pos.z *= mapboxZoomScale;
+      project_pos.z += u_raisingHeight * mapboxZoomScale;
+    }
+  }
+
+  // project_pos.z += 500000.0; // amap1
+
+  // project_pos.z += (500000.0 * 4.0)/pow(2.0, 21.0 - u_Zoom); // mapbox
+  // gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    // gl_Position = u_Mvp * (vec4(project_pos.xyz * vec3(1.0, 1.0, -1.0), 1.0));
+    gl_Position = u_Mvp * (vec4(project_pos.xyz, 1.0));
+  } else {
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));
+  }
+
+  float lightWeight = calc_lighting(pos);
+  // v_Color = a_Color;
+  v_Color = vec4(a_Color.rgb * lightWeight, a_Color.w);
+
+  styleMappingMat[3][1] = lightWeight;
+
+  setPickingColor(a_PickingColor);
+}

package/es/polygon/shaders/extrude/polygon_extrudetex_frag.glsl

@@ -0,0 +1,48 @@
+uniform sampler2D u_texture;
+uniform float u_opacity: 1.0;
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
+uniform float u_linearColor: 0;
+
+uniform float u_topsurface: 1.0;
+uniform float u_sidesurface: 1.0;
+
+varying vec4 v_Color;
+varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
+#pragma include "picking"
+
+void main() {
+  float opacity = styleMappingMat[0][0];
+  float isSide = styleMappingMat[0][3];
+  float lightWeight = styleMappingMat[3][1];
+  float topU = styleMappingMat[2][2];
+  float topV = styleMappingMat[2][3];
+
+  float sidey = styleMappingMat[3][0];
+  if(isSide < 1.0) {
+    // side face
+    if(u_sidesurface < 1.0) {
+      discard;
+    }
+
+    if(u_linearColor == 1.0) {
+      vec4 linearColor = mix(u_targetColor, u_sourceColor, sidey);
+      linearColor.rgb *= lightWeight;
+      gl_FragColor = linearColor;
+    } else {
+      gl_FragColor = v_Color;
+    }
+  } else {
+
+     // top face
+    if(u_topsurface < 1.0) {
+      discard;
+    }
+
+    gl_FragColor = texture2D(u_texture, vec2(topU, topV));
+  }
+  
+
+  gl_FragColor.a *= opacity;
+  gl_FragColor = filterColor(gl_FragColor);
+}

package/es/polygon/shaders/extrude/polygon_extrudetex_vert.glsl

@@ -0,0 +1,93 @@
+precision highp float;
+
+#define ambientRatio 0.5
+#define diffuseRatio 0.3
+#define specularRatio 0.2
+
+attribute vec4 a_Color;
+attribute vec3 a_Position;
+attribute vec3 a_Normal;
+attribute float a_Size;
+attribute vec3 a_uvs;
+uniform mat4 u_ModelMatrix;
+uniform mat4 u_Mvp;
+
+varying vec4 v_Color;
+uniform float u_heightfixed: 0.0; // 默认不固定
+uniform float u_raisingHeight: 0.0;
+uniform float u_opacity: 1.0;
+varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
+
+#pragma include "styleMapping"
+#pragma include "styleMappingCalOpacity"
+
+#pragma include "projection"
+#pragma include "light"
+#pragma include "picking"
+
+void main() {
+  v_Color = a_Color;
+
+  // cal style mapping - 数据纹理映射部分的计算
+  styleMappingMat = mat4(
+    0.0, 0.0, 0.0, 0.0, // opacity - strokeOpacity - strokeWidth - a_Position.z(judge side by a_Position.z)
+    0.0, 0.0, 0.0, 0.0, // strokeR - strokeG - strokeB - strokeA
+    0.0, 0.0, 0.0, 0.0, // offsets[0] - offsets[1] - u - v
+    0.0, 0.0, 0.0, 0.0  // sidey
+  );
+  
+  styleMappingMat[0][3] = a_Position.z;
+  styleMappingMat[2][2] = a_uvs[0];
+  styleMappingMat[2][3] = 1.0 - a_uvs[1];
+  styleMappingMat[3][0] = a_uvs[2];
+
+
+  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 - 数据纹理映射部分的计算
+
+  vec4 pos = vec4(a_Position.xy, a_Position.z * a_Size, 1.0);
+  vec4 project_pos = project_position(pos);
+
+  if(u_heightfixed > 0.0) { // 判断几何体是否固定高度
+    project_pos.z = a_Position.z * a_Size;
+    project_pos.z += u_raisingHeight;
+
+    if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {
+      float mapboxZoomScale = 4.0/pow(2.0, 21.0 - u_Zoom);
+      project_pos.z *= mapboxZoomScale;
+      project_pos.z += u_raisingHeight * mapboxZoomScale;
+    }
+  }
+
+  // project_pos.z += 500000.0; // amap1
+
+  // project_pos.z += (500000.0 * 4.0)/pow(2.0, 21.0 - u_Zoom); // mapbox
+  // gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));
+
+  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
+    // gl_Position = u_Mvp * (vec4(project_pos.xyz * vec3(1.0, 1.0, -1.0), 1.0));
+    gl_Position = u_Mvp * (vec4(project_pos.xyz, 1.0));
+  } else {
+    gl_Position = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));
+  }
+
+  float lightWeight = calc_lighting(pos);
+  styleMappingMat[3][1] = lightWeight;
+
+  setPickingColor(a_PickingColor);
+}

package/es/polygon/shaders/polygon_frag.glsl

@@ -0,0 +1,12 @@
+uniform float u_opacity: 1.0;
+varying vec4 v_color;
+varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
+
+#pragma include "picking"
+
+void main() {
+  float opacity = styleMappingMat[0][0];
+  gl_FragColor = v_color;
+  gl_FragColor.a *= opacity;
+  gl_FragColor = filterColor(gl_FragColor);
+}

package/es/polygon/shaders/polygon_linear_frag.glsl

@@ -0,0 +1,22 @@
+uniform float u_opacity: 1.0;
+varying vec4 v_Color;
+varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
+
+#pragma include "picking"
+uniform float u_opacitylinear: 0.0;
+uniform float u_dir: 1.0;
+varying vec3 v_linear;
+varying vec2 v_pos;
+
+
+void main() {
+  float opacity = styleMappingMat[0][0];
+  gl_FragColor = v_Color;
+  
+  if(u_opacitylinear > 0.0) {
+    gl_FragColor.a *= u_dir == 1.0 ? 1.0 - length(v_pos - v_linear.xy)/v_linear.z : length(v_pos - v_linear.xy)/v_linear.z;
+  }
+
+  gl_FragColor.a *= opacity;
+  gl_FragColor = filterColor(gl_FragColor);
+}