@antv/l7-layers 2.16.0 → 2.16.2

package/es/point/models/text.js

@@ -1,3 +1,4 @@
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
@@ -14,15 +15,15 @@ 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 { boundsContains, calculateCentroid, padBounds } from '@antv/l7-utils';
-import { isEqual, isNumber } from 'lodash';
+import { boundsContains, calculateCentroid, padBounds, rgb2arr } from '@antv/l7-utils';
+import { isEqual } from 'lodash';
 import BaseModel from "../../core/BaseModel";
 import CollisionIndex from "../../utils/collision-index";
 import { getGlyphQuads, shapeText } from "../../utils/symbol-layout";
 /* babel-plugin-inline-import '../shaders/text_frag.glsl' */
-var textFrag = "#define SDF_PX 8.0\n#define EDGE_GAMMA 0.105\n#define FONT_SIZE 48.0\nuniform sampler2D u_sdf_map;\nuniform float u_gamma_scale : 0.5;\n// uniform float u_font_size : 24.0;\nuniform float u_opacity : 1.0;\nuniform vec4 u_stroke_color : [0, 0, 0, 1];\nuniform float u_stroke_width : 2.0;\nuniform float u_halo_blur : 0.5;\nuniform float u_DevicePixelRatio;\n\nvarying vec4 v_color;\nvarying vec2 v_uv;\nvarying float v_gamma_scale;\nvarying float v_fontScale;\n\nvarying mat4 styleMappingMat; // \u4F20\u9012\u4ECE\u7247\u5143\u4E2D\u4F20\u9012\u7684\u6620\u5C04\u6570\u636E\n\n#pragma include \"picking\"\nvoid main() {\n  // get style data mapping\n  float opacity = styleMappingMat[0][0];\n  float strokeWidth = styleMappingMat[0][2];\n  vec4 textrueStroke = vec4(\n    styleMappingMat[1][0],\n    styleMappingMat[1][1],\n    styleMappingMat[1][2],\n    styleMappingMat[1][3]\n  );\n\n  // get sdf from atlas\n  float dist = texture2D(u_sdf_map, v_uv).a;\n\n  // float fontScale = u_font_size / FONT_SIZE;\n\n  // lowp float buff = (6.0 - u_stroke_width / v_fontScale) / SDF_PX;\n  lowp float buff = (6.0 - strokeWidth / v_fontScale) / SDF_PX;\n  highp float gamma = (u_halo_blur * 1.19 / SDF_PX + EDGE_GAMMA) / (v_fontScale * u_gamma_scale) / 1.0;\n\n  highp float gamma_scaled = gamma * v_gamma_scale;\n\n  highp float alpha = smoothstep(buff - gamma_scaled, buff + gamma_scaled, dist);\n  // gl_FragColor = mix(vec4(v_color.rgb, v_color.a * u_opacity), vec4(u_stroke_color.rgb, u_stroke_color.a * u_opacity), smoothstep(0., 0.5, 1. - dist));\n  gl_FragColor = mix(vec4(v_color.rgb, v_color.a * opacity), vec4(textrueStroke.rgb, textrueStroke.a * opacity), smoothstep(0., 0.5, 1. - dist));\n  gl_FragColor.a= gl_FragColor.a * alpha;\n   // \u4F5C\u4E3A mask \u6A21\u677F\u65F6\u9700\u8981\u4E22\u5F03\u900F\u660E\u7684\u50CF\u7D20\n  if (gl_FragColor.a < 0.01) {\n    discard;\n  }\n  gl_FragColor = filterColor(gl_FragColor);\n}\n";
+var textFrag = "#define SDF_PX 8.0\n#define EDGE_GAMMA 0.105\n#define FONT_SIZE 48.0\nuniform sampler2D u_sdf_map;\nuniform float u_gamma_scale : 0.5;\nuniform float u_stroke_width : 2.0;\nuniform float u_halo_blur : 0.5;\nuniform float u_DevicePixelRatio;\n\nvarying vec4 v_color;\nvarying vec4 v_stroke_color;\nvarying vec2 v_uv;\nvarying float v_gamma_scale;\nvarying float v_fontScale;\n\n\n#pragma include \"picking\"\nvoid main() {\n  // get style data mapping\n\n  // get sdf from atlas\n  float dist = texture2D(u_sdf_map, v_uv).a;\n\n  lowp float buff = (6.0 - u_stroke_width / v_fontScale) / SDF_PX;\n  highp float gamma = (u_halo_blur * 1.19 / SDF_PX + EDGE_GAMMA) / (v_fontScale * u_gamma_scale) / 1.0;\n\n  highp float gamma_scaled = gamma * v_gamma_scale;\n\n  highp float alpha = smoothstep(buff - gamma_scaled, buff + gamma_scaled, dist);\n\n  gl_FragColor = mix(v_color, v_stroke_color, smoothstep(0., 0.5, 1.- dist));\n\n  gl_FragColor.a *= alpha;\n   // \u4F5C\u4E3A mask \u6A21\u677F\u65F6\u9700\u8981\u4E22\u5F03\u900F\u660E\u7684\u50CF\u7D20\n  if (gl_FragColor.a < 0.01) {\n    discard;\n  }\n  gl_FragColor = filterColor(gl_FragColor);\n}\n";
 /* babel-plugin-inline-import '../shaders/text_vert.glsl' */
-var textVert = "#define SDF_PX 8.0\n#define EDGE_GAMMA 0.105\n#define FONT_SIZE 24.0\nattribute vec3 a_Position;\nattribute vec2 a_tex;\nattribute vec2 a_textOffsets;\nattribute vec4 a_Color;\nattribute float a_Size;\nattribute float a_Rotate;\n\nuniform vec2 u_sdf_map_size;\nuniform mat4 u_ModelMatrix;\nuniform mat4 u_Mvp;\nuniform float u_raisingHeight: 0.0;\n\nvarying vec2 v_uv;\nvarying float v_gamma_scale;\nvarying vec4 v_color;\nvarying float v_fontScale;\n\nvarying mat4 styleMappingMat; // \u7528\u4E8E\u5C06\u5728\u9876\u70B9\u7740\u8272\u5668\u4E2D\u8BA1\u7B97\u597D\u7684\u6837\u5F0F\u503C\u4F20\u9012\u7ED9\u7247\u5143\n\nuniform float u_opacity : 1;\nuniform float u_stroke_width : 2;\nuniform vec4 u_stroke_color : [0.0, 0.0, 0.0, 0.0];\n\n#pragma include \"styleMapping\"\n#pragma include \"styleMappingCalOpacity\"\n#pragma include \"styleMappingCalStrokeWidth\"\n\n#pragma include \"projection\"\n#pragma include \"picking\"\n\nvoid main() {\n  // cal style mapping - \u6570\u636E\u7EB9\u7406\u6620\u5C04\u90E8\u5206\u7684\u8BA1\u7B97\n   styleMappingMat = mat4(\n    0.0, 0.0, 0.0, 0.0, // opacity - strokeOpacity - strokeWidth - empty\n    0.0, 0.0, 0.0, 0.0, // strokeR - strokeG - strokeB - strokeA\n    0.0, 0.0, 0.0, 0.0, // offsets[0] - offsets[1]\n    0.0, 0.0, 0.0, 0.0\n  );\n\n  float rowCount = u_cellTypeLayout[0][0];    // \u5F53\u524D\u7684\u6570\u636E\u7EB9\u7406\u6709\u51E0\u884C\n  float columnCount = u_cellTypeLayout[0][1]; // \u5F53\u770B\u5230\u6570\u636E\u7EB9\u7406\u6709\u51E0\u5217\n  float columnWidth = 1.0/columnCount;  // \u5217\u5BBD\n  float rowHeight = 1.0/rowCount;       // \u884C\u9AD8\n  float cellCount = calCellCount(); // opacity - strokeOpacity - strokeWidth - stroke - offsets\n  float id = a_vertexId; // \u7B2Cn\u4E2A\u9876\u70B9\n  float cellCurrentRow = floor(id * cellCount / columnCount) + 1.0; // \u8D77\u59CB\u70B9\u5728\u7B2C\u51E0\u884C\n  float cellCurrentColumn = mod(id * cellCount, columnCount) + 1.0; // \u8D77\u59CB\u70B9\u5728\u7B2C\u51E0\u5217\n  \n  // cell \u56FA\u5B9A\u987A\u5E8F opacity -> strokeOpacity -> strokeWidth -> stroke ... \n  // \u6309\u987A\u5E8F\u4ECE cell \u4E2D\u53D6\u503C\u3001\u82E5\u6CA1\u6709\u5219\u81EA\u52A8\u5F80\u4E0B\u53D6\u503C\n  float textureOffset = 0.0; // \u5728 cell \u4E2D\u53D6\u503C\u7684\u504F\u79FB\u91CF\n\n  vec2 opacityAndOffset = calOpacityAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);\n  styleMappingMat[0][0] = opacityAndOffset.r;\n  textureOffset = opacityAndOffset.g;\n\n   vec2 strokeWidthAndOffset = calStrokeWidthAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);\n  styleMappingMat[0][2] = strokeWidthAndOffset.r;\n  textureOffset = strokeWidthAndOffset.g;\n\n  vec4 textrueStroke = vec4(-1.0, -1.0, -1.0, -1.0);\n  if(hasStroke()) {\n    vec2 valueRPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);\n    styleMappingMat[1][0] = pos2value(valueRPos, columnWidth, rowHeight); // R\n    textureOffset += 1.0;\n\n    vec2 valueGPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);\n    styleMappingMat[1][1] = pos2value(valueGPos, columnWidth, rowHeight); // G\n    textureOffset += 1.0;\n\n    vec2 valueBPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);\n    styleMappingMat[1][2] = pos2value(valueBPos, columnWidth, rowHeight); // B\n    textureOffset += 1.0;\n\n    vec2 valueAPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);\n    styleMappingMat[1][3] = pos2value(valueAPos, columnWidth, rowHeight); // A\n    textureOffset += 1.0;\n  } else {\n    if(u_stroke_color == vec4(0.0)) {\n      styleMappingMat[1][0] = v_color.r;\n      styleMappingMat[1][1] = v_color.g;\n      styleMappingMat[1][2] = v_color.b;\n      styleMappingMat[1][3] = v_color.a;\n    } else {\n      styleMappingMat[1][0] = u_stroke_color.r;\n      styleMappingMat[1][1] = u_stroke_color.g;\n      styleMappingMat[1][2] = u_stroke_color.b;\n      styleMappingMat[1][3] = u_stroke_color.a;\n    }\n  }\n  \n  // cal style mapping - \u6570\u636E\u7EB9\u7406\u6620\u5C04\u90E8\u5206\u7684\u8BA1\u7B97\n\n  v_color = a_Color;\n  v_uv = a_tex / u_sdf_map_size;\n\n  // \u6587\u672C\u7F29\u653E\u6BD4\u4F8B\n  float fontScale = a_Size / FONT_SIZE;\n  v_fontScale = fontScale;\n\n  vec4 project_pos = project_position(vec4(a_Position, 1.0));\n  // vec4 projected_position  = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));\n\n  highp float angle_sin = sin(a_Rotate);\n  highp float angle_cos = cos(a_Rotate);\n  mat2 rotation_matrix = mat2(angle_cos, -1.0 * angle_sin, angle_sin, angle_cos);\n  \n  // gl_Position = vec4(projected_position.xy / projected_position.w + rotation_matrix * a_textOffsets * fontScale / u_ViewportSize * 2.0 * u_DevicePixelRatio, 0.0, 1.0);\n\n  float raiseHeight = u_raisingHeight;\n  if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {\n    float mapboxZoomScale = 4.0/pow(2.0, 21.0 - u_Zoom);\n    raiseHeight = u_raisingHeight * mapboxZoomScale;\n  }\n\n  vec4 projected_position;\n  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n   projected_position  = u_Mvp *(vec4(a_Position.xyz + vec3(0.0, 0.0, raiseHeight), 1.0));\n  } else { // else\n   projected_position  = project_common_position_to_clipspace(vec4(project_pos.xyz + vec3(0.0, 0.0, raiseHeight), 1.0));\n  }\n\n  gl_Position = vec4(\n    projected_position.xy / projected_position.w + rotation_matrix * a_textOffsets * fontScale / u_ViewportSize * 2.0 * u_DevicePixelRatio, 0.0, 1.0);\n  v_gamma_scale = gl_Position.w;\n  setPickingColor(a_PickingColor);\n\n}\n";
+var textVert = "#define SDF_PX 8.0\n#define EDGE_GAMMA 0.105\n#define FONT_SIZE 24.0\nattribute vec3 a_Position;\nattribute vec2 a_tex;\nattribute vec2 a_textOffsets;\nattribute vec4 a_Color;\nattribute float a_Size;\nattribute float a_Rotate;\n\nuniform vec2 u_sdf_map_size;\nuniform mat4 u_ModelMatrix;\nuniform mat4 u_Mvp;\nuniform float u_raisingHeight: 0.0;\n\nvarying vec2 v_uv;\nvarying float v_gamma_scale;\nvarying vec4 v_color;\nvarying vec4 v_stroke_color;\nvarying float v_fontScale;\n// uniform float u_opacity : 1;\nuniform float u_stroke_width : 2;\nuniform vec4 u_stroke_color : [0.0, 0.0, 0.0, 0.0];\n\n\n#pragma include \"projection\"\n#pragma include \"picking\"\n\nvoid main() {\n  // cal style mapping - \u6570\u636E\u7EB9\u7406\u6620\u5C04\u90E8\u5206\u7684\u8BA1\u7B97\n  \n  v_uv = a_tex / u_sdf_map_size;\n\n\n\n  v_color = vec4(a_Color.xyz, a_Color.w * opacity);\n  v_stroke_color = vec4(u_stroke_color.xyz, u_stroke_color.w * opacity);\n\n  // \u6587\u672C\u7F29\u653E\u6BD4\u4F8B\n  float fontScale = a_Size / FONT_SIZE;\n  v_fontScale = fontScale;\n\n  vec4 project_pos = project_position(vec4(a_Position, 1.0));\n  // vec4 projected_position  = project_common_position_to_clipspace(vec4(project_pos.xyz, 1.0));\n\n  highp float angle_sin = sin(a_Rotate);\n  highp float angle_cos = cos(a_Rotate);\n  mat2 rotation_matrix = mat2(angle_cos, -1.0 * angle_sin, angle_sin, angle_cos);\n  \n  // gl_Position = vec4(projected_position.xy / projected_position.w + rotation_matrix * a_textOffsets * fontScale / u_ViewportSize * 2.0 * u_DevicePixelRatio, 0.0, 1.0);\n\n  float raiseHeight = u_raisingHeight;\n  if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) {\n    float mapboxZoomScale = 4.0/pow(2.0, 21.0 - u_Zoom);\n    raiseHeight = u_raisingHeight * mapboxZoomScale;\n  }\n\n  vec4 projected_position;\n  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n   projected_position  = u_Mvp *(vec4(a_Position.xyz + vec3(0.0, 0.0, raiseHeight), 1.0));\n  } else { // else\n   projected_position  = project_common_position_to_clipspace(vec4(project_pos.xyz + vec3(0.0, 0.0, raiseHeight), 1.0));\n  }\n\n  gl_Position = vec4(\n    projected_position.xy / projected_position.w + rotation_matrix * a_textOffsets * fontScale / u_ViewportSize * 2.0 * u_DevicePixelRatio, 0.0, 1.0);\n  v_gamma_scale = gl_Position.w;\n  setPickingColor(a_PickingColor);\n\n}\n";
 export function TextTrianglation(feature) {
   // @ts-ignore
   var that = this;
@@ -104,51 +105,16 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
         this.textCount = Object.keys(mapping).length;
       }
       this.preTextStyle = this.getTextStyle();
-      if (this.dataTextureTest && this.dataTextureNeedUpdate({
-        opacity: opacity,
-        strokeWidth: strokeWidth,
-        stroke: stroke
-      })) {
-        this.judgeStyleAttributes({
-          opacity: opacity,
-          strokeWidth: strokeWidth,
-          stroke: stroke
-        });
-        var encodeData = this.layer.getEncodedData();
-        var _this$calDataFrame = this.calDataFrame(this.cellLength, encodeData, this.cellProperties),
-          data = _this$calDataFrame.data,
-          width = _this$calDataFrame.width,
-          height = _this$calDataFrame.height;
-        this.rowCount = height; // 当前数据纹理有多少行
-        this.dataTexture = this.cellLength > 0 && data.length > 0 ? this.createTexture2D({
-          flipY: true,
-          data: data,
-          format: gl.LUMINANCE,
-          type: gl.FLOAT,
-          width: width,
-          height: height
-        }) : this.createTexture2D({
-          flipY: true,
-          data: [1],
-          format: gl.LUMINANCE,
-          type: gl.FLOAT,
-          width: 1,
-          height: 1
-        });
-      }
-      return {
-        u_dataTexture: this.dataTexture,
-        // 数据纹理 - 有数据映射的时候纹理中带数据，若没有任何数据映射时纹理是 [1]
-        u_cellTypeLayout: this.getCellTypeLayout(),
+      return _objectSpread({
         u_raisingHeight: Number(raisingHeight),
-        u_opacity: isNumber(opacity) ? opacity : 1.0,
-        u_stroke_width: isNumber(strokeWidth) ? strokeWidth : 1.0,
-        u_stroke_color: this.getStrokeColor(stroke),
+        // u_opacity: opacity,
+        u_stroke_width: strokeWidth,
+        u_stroke_color: rgb2arr(stroke),
         u_sdf_map: this.texture,
         u_halo_blur: halo,
         u_gamma_scale: gamma,
         u_sdf_map_size: [(canvas === null || canvas === void 0 ? void 0 : canvas.width) || 1, (canvas === null || canvas === void 0 ? void 0 : canvas.height) || 1]
-      };
+      }, this.getStyleAttribute());
     }
   }, {
     key: "initModels",
@@ -193,6 +159,7 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
                 moduleName: 'pointText',
                 vertexShader: textVert,
                 fragmentShader: textFrag,
+                inject: this.getInject(),
                 triangulation: TextTrianglation.bind(this),
                 depth: {
                   enable: false
@@ -269,9 +236,8 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
   }, {
     key: "clearModels",
     value: function clearModels() {
-      var _this$texture, _this$dataTexture;
+      var _this$texture;
       (_this$texture = this.texture) === null || _this$texture === void 0 ? void 0 : _this$texture.destroy();
-      (_this$dataTexture = this.dataTexture) === null || _this$dataTexture === void 0 ? void 0 : _this$dataTexture.destroy();
       // TODO this.mapping
       this.layer.off('remapping', this.mapping);
     }
@@ -301,6 +267,7 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
         type: AttributeType.Attribute,
         descriptor: {
           name: 'a_textOffsets',
+          // 文字偏移量
           buffer: {
             // give the WebGL driver a hint that this buffer may change
             usage: gl.STATIC_DRAW,
@@ -491,7 +458,9 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
           size = _feature$size2 === void 0 ? 1 : _feature$size2;
         var shaping = shapeText(shape.toString(), mapping,
         // @ts-ignore
-        size, textAnchor, 'left', spacing, textOffset || feature.textOffset || [0, 0], iconfont);
+        size, textAnchor, 'left', spacing, textOffset,
+        // || feature['textOffset'] || [0, 0],// TODO: 文字偏移量 CPU 计算
+        iconfont);
         var glyphQuads = getGlyphQuads(shaping, textOffset, false);
         feature.shaping = shaping;
         feature.glyphQuads = glyphQuads;
@@ -635,6 +604,7 @@ var TextModel = /*#__PURE__*/function (_BaseModel) {
                 vertexShader: textVert,
                 fragmentShader: textFrag,
                 triangulation: TextTrianglation.bind(this),
+                inject: this.getInject(),
                 depth: {
                   enable: false
                 }

package/es/point/shaders/animate/wave_frag.glsl

@@ -1,7 +1,6 @@
 
 uniform float u_additive;
 
-varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
 
 varying vec4 v_data;
 varying vec4 v_color;
@@ -14,15 +13,6 @@ uniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];
 
 void main() {
 
-  vec4 textrueStroke = vec4(
-    styleMappingMat[1][0],
-    styleMappingMat[1][1],
-    styleMappingMat[1][2],
-    styleMappingMat[1][3]
-  );
-
-  float opacity = styleMappingMat[0][0];
-
   lowp float antialiasblur = v_data.z;
   float r = v_radius / (v_radius);
 
@@ -45,7 +35,7 @@ void main() {
   float N_RINGS = 3.0;
   float FREQ = 1.0;
 
- gl_FragColor = vec4(v_color.rgb, v_color.a * opacity);
+  gl_FragColor = v_color;
 
   float d = length(v_data.xy);
   if(d > 0.5) {

package/es/point/shaders/earth/extrude_frag.glsl

@@ -5,7 +5,6 @@ uniform float u_pickLight: 0.0;
 
 #pragma include "picking"
 
-varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
 
 uniform float u_linearColor: 0;
 uniform vec4 u_sourceColor;
@@ -13,31 +12,20 @@ uniform vec4 u_targetColor;
 
 uniform float u_opacitylinear: 0.0;
 uniform float u_opacitylinear_dir: 1.0;
-
+varying float v_lightWeight;
+varying float v_barLinearZ;
 void main() {
-  float opacity = styleMappingMat[0][0];
-  float lightWeight = styleMappingMat[1][3];
-  float barLinearZ = styleMappingMat[2][3];
-
-  // 设置圆柱的底色
-  if(u_linearColor == 1.0) { // 使用渐变颜色
-    gl_FragColor = mix(u_sourceColor, u_targetColor, barLinearZ);
-    gl_FragColor.rgb *= lightWeight;
-  } else { // 使用 color 方法传入的颜色
-     gl_FragColor = v_color;
-  }
 
-  // 应用透明度
-  gl_FragColor.a *= opacity;
+   gl_FragColor = v_color;
 
   // 开启透明度渐变
   if(u_opacitylinear > 0.0) {
-    gl_FragColor.a *= u_opacitylinear_dir > 0.0 ? (1.0 - barLinearZ): barLinearZ;
+    gl_FragColor.a *= u_opacitylinear_dir > 0.0 ? (1.0 - v_barLinearZ): v_barLinearZ;
   }
 
   // picking
   if(u_pickLight > 0.0) {
-    gl_FragColor = filterColorAlpha(gl_FragColor, lightWeight);
+    gl_FragColor = filterColorAlpha(gl_FragColor, v_lightWeight);
   } else {
     gl_FragColor = filterColor(gl_FragColor);
   }

package/es/point/shaders/earth/extrude_vert.glsl

@@ -20,11 +20,10 @@ varying vec4 v_color;
 
 uniform float u_opacity : 1;
 uniform float u_lightEnable: 1;
+varying float v_lightWeight;
+varying float v_barLinearZ;
+// 用于将在顶点着色器中计算好的样式值传递给片元
 
-varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
-
-#pragma include "styleMapping"
-#pragma include "styleMappingCalOpacity"
 
 #pragma include "projection"
 #pragma include "light"
@@ -48,35 +47,15 @@ float getXRadian(float y, float r) {
 
 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 - lightWeight
-    0.0, 0.0, 0.0, 0.0, // offsets[0] - offsets[1] - linearZ(垂直方向 0 - 1 的值)
-    0.0, 0.0, 0.0, 0.0
-  );
-
-  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_Size * a_Position;
 
   // a_Position.z 是在构建网格的时候传入的标准值 0 - 1，在插值器插值可以获取 0～1 线性渐变的值
-  styleMappingMat[2][3] =  a_Position.z;
+  v_barLinearZ =  a_Position.z;
 
   vec3 offset = size; // 控制圆柱体的大小 - 从标准单位圆柱体进行偏移
   if(u_heightfixed < 1.0) { // 圆柱体不固定高度
@@ -106,11 +85,17 @@ void main() {
   if(u_lightEnable > 0.0) { // 取消三元表达式，增强健壮性
     lightWeight = calc_lighting(pos);
   }
-  styleMappingMat[1][3] = lightWeight;
-
-  v_color =vec4(a_Color.rgb * lightWeight, a_Color.w);
+  v_lightWeight = lightWeight;
+  // 设置圆柱的底色
+  if(u_linearColor == 1.0) { // 使用渐变颜色
+    v_color = mix(u_sourceColor, u_targetColor, barLinearZ);
+    v_color.rgb *= lightWeight;
+  } else { // 使用 color 方法传入的颜色
+     v_color = a_Color;
+  }
+  v_color.a *= u_opacity;
 
-  
+    
   // 在地球模式下，将原本垂直于 xy 平面的圆柱调整姿态到适应圆的角度
   //旋转矩阵mx，创建绕x轴旋转矩阵
   float r = sqrt(a_Pos.z*a_Pos.z + a_Pos.x*a_Pos.x);

package/es/point/shaders/earth/fill_frag.glsl

@@ -1,6 +1,7 @@
 uniform float u_additive;
-
-varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
+uniform float u_opacity : 1;
+uniform float u_stroke_opacity : 1;
+uniform float u_stroke_width : 2;
 
 varying vec4 v_data;
 varying vec4 v_color;
@@ -13,16 +14,6 @@ varying float v_radius;
 void main() {
   int shape = int(floor(v_data.w + 0.5));
 
-  vec4 textrueStroke = vec4(
-    styleMappingMat[1][0],
-    styleMappingMat[1][1],
-    styleMappingMat[1][2],
-    styleMappingMat[1][3]
-  );
-
-  float opacity = styleMappingMat[0][0];
-  float stroke_opacity = styleMappingMat[0][1];
-  float strokeWidth = styleMappingMat[0][2];
   vec4 strokeColor = textrueStroke == vec4(0) ? v_color : textrueStroke;
 
   lowp float antialiasblur = v_data.z;
@@ -71,9 +62,9 @@ void main() {
   );
 
   if(strokeWidth < 0.01) {
-    gl_FragColor = vec4(v_color.rgb, v_color.a * opacity);
+    gl_FragColor = vec4(v_color.rgb, v_color.a * u_opacity);
   } else {
-    gl_FragColor = mix(vec4(v_color.rgb, v_color.a * opacity), strokeColor * stroke_opacity, color_t);
+    gl_FragColor = mix(vec4(v_color.rgb, v_color.a * u_opacity), u_stroke_color * u_stroke_opacity, color_t);
   }
 
   if(u_additive > 0.0) {

package/es/point/shaders/earth/fill_vert.glsl

@@ -3,9 +3,6 @@ attribute vec3 a_Position;
 attribute vec3 a_Extrude;
 attribute float a_Size;
 attribute float a_Shape;
-
-varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
-
 uniform mat4 u_ModelMatrix;
 uniform mat4 u_Mvp;
 
@@ -21,11 +18,6 @@ uniform vec2 u_offsets;
 
 uniform float u_blur : 0.0;
 
-#pragma include "styleMapping"
-#pragma include "styleMappingCalOpacity"
-#pragma include "styleMappingCalStrokeOpacity"
-#pragma include "styleMappingCalStrokeWidth"
-
 #pragma include "projection"
 #pragma include "picking"
 
@@ -39,72 +31,6 @@ void main() {
   float newSize = setPickingSize(a_Size);
   // float newSize = setPickingSize(a_Size) * 0.00001038445708445579;
 
-  // 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
-  );
-
-  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;
-
-  vec2 strokeOpacityAndOffset = calStrokeOpacityAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);
-  styleMappingMat[0][1] = strokeOpacityAndOffset.r;
-  textureOffset = strokeOpacityAndOffset.g;
-
-  vec2 strokeWidthAndOffset = calStrokeWidthAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);
-  styleMappingMat[0][2] = strokeWidthAndOffset.r;
-  textureOffset = strokeWidthAndOffset.g;
-
-  vec4 textrueStroke = vec4(-1.0, -1.0, -1.0, -1.0);
-  if(hasStroke()) {
-    vec2 valueRPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);
-    styleMappingMat[1][0] = pos2value(valueRPos, columnWidth, rowHeight); // R
-    textureOffset += 1.0;
-
-    vec2 valueGPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);
-    styleMappingMat[1][1] = pos2value(valueGPos, columnWidth, rowHeight); // G
-    textureOffset += 1.0;
-
-    vec2 valueBPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);
-    styleMappingMat[1][2] = pos2value(valueBPos, columnWidth, rowHeight); // B
-    textureOffset += 1.0;
-
-    vec2 valueAPos = nextPos(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset);
-    styleMappingMat[1][3] = pos2value(valueAPos, columnWidth, rowHeight); // A
-    textureOffset += 1.0;
-  } else {
-    if(u_stroke_color == vec4(0.0)) {
-      styleMappingMat[1][0] = v_color.r;
-      styleMappingMat[1][1] = v_color.g;
-      styleMappingMat[1][2] = v_color.b;
-      styleMappingMat[1][3] = v_color.a;
-    } else {
-      styleMappingMat[1][0] = u_stroke_color.r;
-      styleMappingMat[1][1] = u_stroke_color.g;
-      styleMappingMat[1][2] = u_stroke_color.b;
-      styleMappingMat[1][3] = u_stroke_color.a;
-    }
-  }
-
-  // cal style mapping
-
   // unpack color(vec2)
   v_color = a_Color;
 
@@ -119,7 +45,7 @@ void main() {
   v_data = vec4(extrude.x/abs(extrude.x), extrude.y/abs(extrude.y), antialiasblur,shape_type);
 
 
-  gl_Position = u_ViewProjectionMatrix * vec4(a_Position + extrude * newSize * 0.1, 1.0);
+  gl_Position = u_ViewProjectionMatrix * vec4(a_Position + extrude * newSize * 0.1 + u_offsets, 1.0);
 
   setPickingColor(a_PickingColor);
 }

package/es/point/shaders/extrude/extrude_frag.glsl

@@ -1,43 +1,17 @@
 varying vec4 v_color;
-uniform float u_opacity: 1.0;
-
+varying float v_lightWeight;
 uniform float u_pickLight: 0.0;
 
 #pragma include "picking"
 
-varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
-
-uniform float u_linearColor: 0;
-uniform vec4 u_sourceColor;
-uniform vec4 u_targetColor;
-
-uniform float u_opacitylinear: 0.0;
-uniform float u_opacitylinear_dir: 1.0;
 
 void main() {
-  float opacity = styleMappingMat[0][0];
-  float lightWeight = styleMappingMat[1][3];
-  float barLinearZ = styleMappingMat[2][3];
-
-  // 设置圆柱的底色
-  if(u_linearColor == 1.0) { // 使用渐变颜色
-    gl_FragColor = mix(u_sourceColor, u_targetColor, barLinearZ);
-    gl_FragColor.rgb *= lightWeight;
-  } else { // 使用 color 方法传入的颜色
-     gl_FragColor = v_color;
-  }
-
-  // 应用透明度
-  gl_FragColor.a *= opacity;
 
+  gl_FragColor = v_color;
   // 开启透明度渐变
-  if(u_opacitylinear > 0.0) {
-    gl_FragColor.a *= u_opacitylinear_dir > 0.0 ? (1.0 - barLinearZ): barLinearZ;
-  }
-
   // picking
   if(u_pickLight > 0.0) {
-    gl_FragColor = filterColorAlpha(gl_FragColor, lightWeight);
+    gl_FragColor = filterColorAlpha(gl_FragColor, v_lightWeight);
   } else {
     gl_FragColor = filterColor(gl_FragColor);
   }

package/es/point/shaders/extrude/extrude_vert.glsl

@@ -16,14 +16,17 @@ uniform float u_r;
 uniform mat4 u_ModelMatrix;
 uniform mat4 u_Mvp;
 varying vec4 v_color;
+varying float v_lightWeight;
+varying float v_barLinearZ;
 
 uniform float u_opacity : 1;
 uniform float u_lightEnable: 1;
+uniform float u_opacitylinear: 0.0;
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
+uniform float u_opacitylinear_dir: 1.0;
+uniform float  u_linearColor: 0.0;
 
-varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
-
-#pragma include "styleMapping"
-#pragma include "styleMappingCalOpacity"
 
 #pragma include "projection"
 #pragma include "light"
@@ -47,37 +50,11 @@ float getXRadian(float y, float r) {
 
 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 - lightWeight
-    0.0, 0.0, 0.0, 0.0, // offsets[0] - offsets[1] - linearZ(垂直方向 0 - 1 的值)
-    0.0, 0.0, 0.0, 0.0
-  );
-
-  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_Size * a_Position;
 
-  // a_Position.z 是在构建网格的时候传入的标准值 0 - 1，在插值器插值可以获取 0～1 线性渐变的值
-  styleMappingMat[2][3] =  a_Position.z;
+  vec3 size = a_Size * a_Position;
 
   vec3 offset = size; // 控制圆柱体的大小 - 从标准单位圆柱体进行偏移
+
   if(u_heightfixed < 1.0) { // 圆柱体不固定高度
     
     if (u_CoordinateSystem == COORDINATE_SYSTEM_P20 || u_CoordinateSystem == COORDINATE_SYSTEM_P20_OFFSET) {
@@ -100,14 +77,29 @@ void main() {
   // u_r 控制圆柱的生长
   vec4 pos = vec4(project_pos.xy + offset.xy, offset.z * u_r, 1.0);
 
-  // 圆柱光照效果
+  // // 圆柱光照效果
   float lightWeight = 1.0;
+
   if(u_lightEnable > 0.0) { // 取消三元表达式，增强健壮性
     lightWeight = calc_lighting(pos);
   }
-  styleMappingMat[1][3] = lightWeight;
 
-  v_color =vec4(a_Color.rgb * lightWeight, a_Color.w);
+  v_lightWeight = lightWeight;
+
+  v_color = a_Color;
+
+    // 设置圆柱的底色
+  if(u_linearColor == 1.0) { // 使用渐变颜色
+    v_color = mix(u_sourceColor, u_targetColor, a_Position.z);
+    v_color.a =  v_color.a * u_opacity;
+  } else {
+    v_color = vec4(a_Color.rgb * lightWeight, a_Color.w * u_opacity);
+  }
+
+    if(u_opacitylinear > 0.0) {
+    v_color.a *= u_opacitylinear_dir > 0.0 ? (1.0 - a_Position.z): a_Position.z;
+  }
+
 
   // gl_Position = project_common_position_to_clipspace(pos);
 

package/es/point/shaders/fill_frag.glsl

@@ -1,10 +1,12 @@
 uniform float u_additive;
-
-varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
+uniform float u_stroke_opacity : 1;
+uniform float u_stroke_width : 2;
 
 varying vec4 v_data;
 varying vec4 v_color;
 varying float v_radius;
+varying vec4 v_stroke;
+
 
 #pragma include "sdf_2d"
 #pragma include "picking"
@@ -12,21 +14,8 @@ varying float v_radius;
 
 void main() {
   int shape = int(floor(v_data.w + 0.5));
-
-  vec4 textrueStroke = vec4(
-    styleMappingMat[1][0],
-    styleMappingMat[1][1],
-    styleMappingMat[1][2],
-    styleMappingMat[1][3]
-  );
-
-  float opacity = styleMappingMat[0][0];
-  float stroke_opacity = styleMappingMat[0][1];
-  float strokeWidth = styleMappingMat[0][2];
-  vec4 strokeColor = textrueStroke == vec4(0) ? v_color : textrueStroke;
-
   lowp float antialiasblur = v_data.z;
-  float r = v_radius / (v_radius + strokeWidth);
+  float r = v_radius / (v_radius + u_stroke_width);
 
   float outer_df;
   float inner_df;
@@ -62,16 +51,16 @@ void main() {
 
   float opacity_t = smoothstep(0.0, antialiasblur, outer_df);
 
-  float color_t = strokeWidth < 0.01 ? 0.0 : smoothstep(
+  float color_t = u_stroke_width < 0.01 ? 0.0 : smoothstep(
     antialiasblur,
     0.0,
     inner_df
   );
 
-  if(strokeWidth < 0.01) {
-    gl_FragColor = vec4(v_color.rgb, v_color.a * opacity);
+  if(u_stroke_width < 0.01) {
+    gl_FragColor = v_color;
   } else {
-    gl_FragColor = mix(vec4(v_color.rgb, v_color.a * opacity), strokeColor * stroke_opacity, color_t);
+    gl_FragColor = mix(v_color, v_stroke * u_stroke_opacity, color_t);
   }
 
   if(u_additive > 0.0) {