@antv/l7-layers 2.16.0 → 2.16.2

package/es/line/shaders/line_vert.glsl

@@ -37,11 +37,7 @@ uniform float u_arrowHeight: 3.0;
 uniform float u_arrowWidth: 2.0;
 uniform float u_tailWidth: 1.0;
 
-uniform float u_opacity: 1.0;
-varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
-
-#pragma include "styleMapping"
-#pragma include "styleMappingCalOpacity"
+varying vec4 v_texture_data;
 
 vec2 calculateArrow(vec2 offset) {
   /*
@@ -87,31 +83,7 @@ vec2 calculateArrow(vec2 offset) {
 
 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 - 数据纹理映射部分的计算
-
   float d_texPixelLen;    // 贴图的像素长度，根据地图层级缩放
 
   v_iconMapUV = a_iconMapUV;
@@ -141,12 +113,9 @@ void main() {
   float lineOffsetWidth = length(offset + offset * sign(a_Miter)); // 线横向偏移的距离（向两侧偏移的和）
   float linePixelSize = project_pixel(a_Size.x) * 2.0;  // 定点位置偏移，按地图等级缩放后的距离 单侧 * 2
   float texV = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值
-
+  
+  v_texture_data = vec4(currentLinePointRatio, lineDistance, d_texPixelLen, texV);
   // 设置数据集的参数
-  styleMappingMat[3][0] = currentLinePointRatio; // 当前点位距离占线总长的比例
-  styleMappingMat[3][1] = lineDistance;       // 当前顶点的距离
-  styleMappingMat[3][2] = d_texPixelLen;    // 贴图的像素长度，根据地图层级缩放
-  styleMappingMat[3][3] = texV;             // 线图层贴图部分的 v 坐标值
 
   vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
 

package/es/line/shaders/linear/arc3d_linear_frag.glsl

@@ -1,34 +1,20 @@
 
 #define Animate 0.0
-
-uniform float u_opacity;
-uniform float u_blur : 0.9;
-varying float v_segmentIndex;
-uniform float segmentNumber;
-
 uniform float u_time;
 uniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];
+varying vec4 v_Color;
 
-uniform float u_linearColor: 0;
-uniform vec4 u_sourceColor;
-uniform vec4 u_targetColor;
-
-varying mat4 styleMappingMat;
-
+varying float v_distance_ratio;
 #pragma include "picking"
 
 void main() {
-  float opacity = styleMappingMat[0][0];
-  float animateSpeed = 0.0; // 运动速度
-  float d_distance_ratio = styleMappingMat[3].g; // 当前点位距离占线总长的比例
-
-  gl_FragColor = mix(u_sourceColor, u_targetColor, v_segmentIndex/segmentNumber);
 
-  gl_FragColor.a *= opacity;
+  float animateSpeed = 0.0; // 运动速度
+  gl_FragColor = v_Color;
 
   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) + u_time / u_animate.y);
+      float alpha =1.0 - fract( mod(1.0- v_distance_ratio, u_animate.z)* (1.0/ u_animate.z) + u_time / u_animate.y);
 
       alpha = (alpha + u_animate.w -1.0) / u_animate.w;
       // alpha = smoothstep(0., 1., alpha);

package/es/line/shaders/linear/arc3d_linear_vert.glsl

@@ -15,22 +15,19 @@ uniform mat4 u_ModelMatrix;
 uniform mat4 u_Mvp;
 uniform float segmentNumber;
 uniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
 
 uniform float u_line_type: 0.0;
 uniform vec4 u_dash_array: [10.0, 5., 0, 0];
 uniform float u_icon_step: 100;
 uniform float u_line_texture: 0.0;
-uniform float u_opacity: 1.0;
+varying float v_distance_ratio;
 
 varying vec4 v_dash_array;
 varying vec4 v_color;
-varying float v_segmentIndex;
 varying vec2 v_iconMapUV;
-varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
-
-
-#pragma include "styleMapping"
-#pragma include "styleMappingCalOpacity"
+varying vec4 v_Color;
 
 #pragma include "projection"
 #pragma include "project"
@@ -99,30 +96,6 @@ vec3 lglt2xyz(vec2 lnglat) {
 
 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  // dataset 数据集
-  );
-
-  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;
   vec2 source = project_position(vec4(a_Instance.rg, 0, 0)).xy;
@@ -146,32 +119,20 @@ void main() {
     v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / (total_Distance / segmentNumber * segmentIndex);
   }
     if(u_animate.x == Animate) {
-      d_distance_ratio = segmentIndex / segmentNumber;
+      v_distance_ratio = segmentIndex / segmentNumber;
   }
-  styleMappingMat[3].g = d_distance_ratio; // 当前点位距离占线总长的比例
+
 
   float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);
   vec3 curr = getPos(source, target, segmentRatio);
   vec3 next = getPos(source, target, nextSegmentRatio);
   vec2 offset = getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y);
-  // v_normal = getNormal((next.xy - curr.xy) * indexDir, a_Position.y);
-
 
-  v_segmentIndex = a_Position.x;
-  if(LineTexture == u_line_texture && u_line_type != LineTypeDash) { // 开启贴图模式  
+  float animateSpeed = 0.0; // 运动速度
+  v_Color = mix(u_sourceColor, u_targetColor, a_Position.x/segmentNumber);
 
-    float arcDistrance = length(source - target);
-    float pixelLen =  project_pixel_texture(u_icon_step);
-    styleMappingMat[3].b = floor(arcDistrance/pixelLen); // 贴图在弧线上重复的数量
+  v_Color.a *= opacity;
 
-    vec2 projectOffset = project_pixel(offset);
-    float lineOffsetWidth = length(projectOffset + projectOffset * sign(a_Position.y)); // 线横向偏移的距离
-    float linePixelSize = project_pixel(a_Size);  // 定点位置偏移，按地图等级缩放后的距离
-    styleMappingMat[3].a = lineOffsetWidth/linePixelSize;  // 线图层贴图部分的 v 坐标值
-
-    v_iconMapUV = a_iconMapUV;
-  }
-  
 
   // gl_Position = project_common_position_to_clipspace(vec4(curr.xy + project_pixel(offset), curr.z, 1.0));
   if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x

package/es/line/shaders/linear/arc_linear_frag.glsl

@@ -1,38 +1,10 @@
-#define Animate 0.0
-#define LineTexture 1.0
-
-uniform float u_opacity;
-uniform float u_textureBlend;
-uniform float u_blur : 0.9;
-uniform float u_line_type: 0.0;
-// varying vec2 v_normal;
-varying vec4 v_dash_array;
 varying vec4 v_color;
 
-uniform float u_time;
-uniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];
-
-uniform float u_line_texture;
-uniform sampler2D u_texture;
-uniform vec2 u_textSize;
-
-uniform float segmentNumber;
-varying vec2 v_iconMapUV;
-
-varying mat4 styleMappingMat; // 传递从片元中传递的映射数据
-
-uniform float u_linearColor: 0;
-uniform vec4 u_sourceColor;
-uniform vec4 u_targetColor;
-
 #pragma include "picking"
 
 void main() {
-  float opacity = styleMappingMat[0][0];
-  float d_segmentIndex = styleMappingMat[3].r;   // 当前顶点在弧线中所处的分段位置
+// 当前顶点在弧线中所处的分段位置
 
-  // 设置弧线的底色
-  gl_FragColor = mix(u_sourceColor, u_targetColor, d_segmentIndex/segmentNumber);
-  gl_FragColor.a *= opacity;
+  gl_FragColor = v_Color;
   gl_FragColor = filterColor(gl_FragColor);
 }

package/es/line/shaders/linear/arc_linear_vert.glsl

@@ -7,17 +7,16 @@ uniform mat4 u_ModelMatrix;
 uniform mat4 u_Mvp;
 uniform float segmentNumber;
 varying vec4 v_color;
+varying float v_segmentIndex;
 
 uniform float u_lineDir: 1.0;
 
 uniform float u_thetaOffset: 0.314;
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
+
 
-uniform float u_opacity: 1.0;
-varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
 
-#pragma include "styleMapping"
-#pragma include "styleMappingCalOpacity"
-#pragma include "styleMappingCalThetaOffset"
 
 #pragma include "projection"
 #pragma include "project"
@@ -73,37 +72,6 @@ vec2 getNormal(vec2 line_clipspace, float offset_direction) {
 void main() {
   v_color = a_Color;
 
-  // 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  // dataset 数据集
-  );
-
-  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 -> thetaOffset... 
-  // 按顺序从 cell 中取值、若没有则自动往下取值
-  float textureOffset = 0.0; // 在 cell 中取值的偏移量
-
-  vec2 opacityAndOffset = calOpacityAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);
-  styleMappingMat[0][0] = opacityAndOffset.r;
-  textureOffset = opacityAndOffset.g;
-
-  vec2 thetaOffsetAndOffset = calThetaOffsetAndOffset(cellCurrentRow, cellCurrentColumn, columnCount, textureOffset, columnWidth, rowHeight);
-  styleMappingMat[0][1] = thetaOffsetAndOffset.r;
-  textureOffset = thetaOffsetAndOffset.g;
-  // cal style mapping - 数据纹理映射部分的计算
-
-  
   vec2 source = a_Instance.rg;  // 起始点
   vec2 target =  a_Instance.ba; // 终点
   float segmentIndex = a_Position.x;
@@ -112,12 +80,8 @@ void main() {
   float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));
   float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);
   float d_distance_ratio;
-
-   styleMappingMat[3].b = d_distance_ratio;
-
-  // styleMappingMat[0][1] - arcThetaOffset
-  vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio, styleMappingMat[0][1]), 0.0, 1.0));
-  vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio, styleMappingMat[0][1]), 0.0, 1.0));
+  vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio, u_thetaOffset, 0.0, 1.0));
+  vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio, u_thetaOffset), 0.0, 1.0));
   // v_normal = getNormal((next.xy - curr.xy) * indexDir, a_Position.y);
   //unProjCustomCoord
   
@@ -125,11 +89,11 @@ void main() {
 
 
   float d_segmentIndex = a_Position.x + 1.0; // 当前顶点在弧线中所处的分段位置
-  styleMappingMat[3].r = d_segmentIndex;
 
-  // gl_Position = project_common_position_to_clipspace(vec4(curr.xy + offset, 0, 1.0));
+  v_Color = mix(u_sourceColor, u_targetColor, d_segmentIndex/segmentNumber);
+  v_Color.a *= u_opacity;
+
   if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x
-    // gl_Position = u_Mvp * (vec4(curr.xy + offset, 0, 1.0));
     gl_Position = u_Mvp * (vec4(curr.xy + offset, 0, 1.0));
   } else {
     gl_Position = project_common_position_to_clipspace(vec4(curr.xy + offset, 0, 1.0));

package/es/line/shaders/linear/line_linear_frag.glsl

@@ -1,19 +1,18 @@
 varying vec4 v_color;
+varying vec4 v_texture_data;
 uniform float u_linearDir: 1.0;
 uniform float u_linearColor: 0;
 uniform vec4 u_sourceColor;
 uniform vec4 u_targetColor;
+uniform float u_opacity: 1.0;
 
 #pragma include "picking"
 
 
-varying mat4 styleMappingMat;
-
 void main() {
-  float opacity = styleMappingMat[0][0];
-  float linearRadio = styleMappingMat[3][0]; // 当前点位距离占线总长的比例
+  float linearRadio = v_texture_data.r; // 当前点位距离占线总长的比例
   if(u_linearDir < 1.0) {
-    linearRadio = styleMappingMat[3][3];
+    linearRadio = v_texture_data.a;
   }
 
   if(u_linearColor == 1.0) { // 使用渐变颜色
@@ -22,6 +21,6 @@ void main() {
      gl_FragColor = v_color;
   }
 
-  gl_FragColor.a *= opacity; // 全局透明度
+  gl_FragColor.a *= u_opacity; // 全局透明度
   gl_FragColor = filterColor(gl_FragColor);
 }

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

@@ -1,20 +1,8 @@
-uniform float u_opacity : 1.0;
-uniform sampler2D u_texture;
-uniform float u_linearDir: 1.0;
 
+varying vec4 v_Color;
 #pragma include "picking"
-
-varying mat4 styleMappingMat;
-
 void main() {
-  float opacity = styleMappingMat[0][0];
-  float linearRadio = styleMappingMat[3].r; // 当前点位距离占线总长的比例
-  if(u_linearDir < 1.0) {
-    linearRadio = styleMappingMat[3][3];
-  }
-
-  gl_FragColor = texture2D(u_texture, vec2(linearRadio, 0.5));
 
-  gl_FragColor.a *= opacity; // 全局透明度
+  gl_FragColor = v_Color; // 全局透明度
   gl_FragColor = filterColor(gl_FragColor);
 }

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

@@ -14,43 +14,18 @@ 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;
+uniform sampler2D u_texture;
+uniform float u_linearDir: 1.0;
+varying vec4 v_Color;
 
-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);
   
@@ -64,9 +39,16 @@ void main() {
   float linePixelSize = project_pixel(a_Size.x) * 2.0;  // 定点位置偏移，按地图等级缩放后的距离 单侧 * 2
   float texV = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值
 
-  // 设置数据集的参数
-  styleMappingMat[3][0] = currentLinePointRatio; // 当前点位距离占线总长的比例
-  styleMappingMat[3][3] = texV;             // 线图层贴图部分的 v 坐标值
+  float linearRadio =currentLinePointRatio; // 当前点位距离占线总长的比例
+  if(u_linearDir < 1.0) {
+    linearRadio = texV;
+  }
+
+  v_Color = texture2D(u_texture, vec2(linearRadio, 0.5));
+
+  v_Color.a *= u_opacity; // 全局透明度
+
+
 
   vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
 

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

@@ -1,10 +1,6 @@
 
 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

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

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

@@ -10,47 +10,21 @@ uniform mat4 u_Mvp;
 
 uniform float u_opacity: 1.0;
 uniform float u_vertexScale: 1.0;
+uniform vec4 u_sourceColor;
+uniform vec4 u_targetColor;
 
-#pragma include "projection"
 
-varying vec4 v_color;
 
-varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元
+#pragma include "projection"
 
-#pragma include "styleMapping"
-#pragma include "styleMappingCalOpacity"
+varying vec4 v_color;
+varying float v_distanceScale;
 
 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;
-
+  v_distanceScale = a_Distance / a_Total_Distance;
+  v_color = vec4(a_Color.xyz, a_Color.w * u_opacity); 
   vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
 
   float h = float(a_Position.z) * u_vertexScale; // 线顶点的高度 - 兼容不存在第三个数值的情况

package/es/plugins/DataMappingPlugin.js

@@ -98,7 +98,9 @@ var DataMappingPlugin = (_dec = injectable(), _dec2 = inject(TYPES.IMapService),
         }
         if (attributesToRemapping.length) {
           // 过滤数据
-          var encodeData = _this.mapping(layer, attributesToRemapping, filterData, layer.getEncodedData());
+          var encodeData = _this.mapping(layer, attributesToRemapping, filterData, layer.getEncodedData() // TODO 优化
+          );
+
           layer.setEncodedData(encodeData);
         }
 
@@ -125,7 +127,7 @@ var DataMappingPlugin = (_dec = injectable(), _dec2 = inject(TYPES.IMapService),
       // 数据处理 在数据进行 mapping 生成 encodeData 之前对数据进行处理
       // 在各个 layer 中继承
 
-      filterData = layer.processData(filterData);
+      filterData = layer.processData(filterData); // 目前只有简单线需要处理
       var encodeData = this.mapping(layer, attributes, filterData, undefined);
       layer.setEncodedData(encodeData);
       if (dataArray.length === 0 && layer.encodeDataLength === 0) {
@@ -157,8 +159,8 @@ var DataMappingPlugin = (_dec = injectable(), _dec2 = inject(TYPES.IMapService),
         }, preRecord);
         usedAttributes.forEach(function (attribute) {
           var values = _this3.applyAttributeMapping(attribute, record);
-          // TODO: 支持每个属性配置 postprocess
-          if (attribute.name === 'color') {
+          // TODO: 支持每个属性配置 postprocess}
+          if (attribute.name === 'color' || attribute.name === 'stroke') {
             values = values.map(function (c) {
               return rgb2arr(c);
             });
@@ -171,7 +173,7 @@ var DataMappingPlugin = (_dec = injectable(), _dec2 = inject(TYPES.IMapService),
             encodeRecord.shape = _this3.fontService.getIconFontKey(encodeRecord[attribute.name]);
           }
         });
-        if (arrow.enable && (encodeRecord.shape === 'line' || encodeRecord.shape === 'halfLine')) {
+        if (arrow.enable && encodeRecord.shape === 'line') {
           // 只有在线图层且支持配置箭头的时候进行插入顶点的处理
           var coords = encodeRecord.coordinates;
           // @ts-ignore
@@ -202,36 +204,20 @@ var DataMappingPlugin = (_dec = injectable(), _dec2 = inject(TYPES.IMapService),
       // 根据地图的类型判断是否需要对点位数据进行处理, 若是高德2.0则需要对坐标进行相对偏移
       if (mappedData.length > 0 && this.mapService.version === Version['GAODE2.x']) {
         var layerCenter = layer.coordCenter || layer.getSource().center;
-        if (typeof mappedData[0].coordinates[0] === 'number') {
-          // 单个的点数据
+        // 单个的点数据
+        // @ts-ignore
+        mappedData
+        // TODO: 避免经纬度被重复计算导致坐标位置偏移
+        .filter(function (d) {
+          return !d.originCoordinates;
+        }).map(function (d) {
+          d.version = Version['GAODE2.x'];
           // @ts-ignore
-          mappedData
-          // TODO: 避免经纬度被重复计算导致坐标位置偏移
-          .filter(function (d) {
-            return !d.originCoordinates;
-          }).map(function (d) {
-            d.version = Version['GAODE2.x'];
-            // @ts-ignore
-            d.originCoordinates = cloneDeep(d.coordinates); // 为了兼容高德1.x 需要保存一份原始的经纬度坐标数据（许多上层逻辑依赖经纬度数据）
-            // @ts-ignore
-            // d.coordinates = this.mapService.lngLatToCoord(d.coordinates);
-            d.coordinates = _this4.mapService.lngLatToCoordByLayer(d.coordinates, layerCenter);
-          });
-        } else {
-          // 连续的线、面数据
-          mappedData
-          // TODO: 避免经纬度被重复计算导致坐标位置偏移
-          .filter(function (d) {
-            return !d.originCoordinates;
-          }).map(function (d) {
-            d.version = Version['GAODE2.x'];
-            // @ts-ignore
-            d.originCoordinates = cloneDeep(d.coordinates); // 为了兼容高德1.x 需要保存一份原始的经纬度坐标数据（许多上层逻辑依赖经纬度数据）
-            // @ts-ignore
-            // d.coordinates = this.mapService.lngLatToCoords(d.coordinates);
-            d.coordinates = _this4.mapService.lngLatToCoordsByLayer(d.coordinates, layerCenter);
-          });
-        }
+          d.originCoordinates = cloneDeep(d.coordinates); // 为了兼容高德1.x 需要保存一份原始的经纬度坐标数据（许多上层逻辑依赖经纬度数据）
+          // @ts-ignore
+          // d.coordinates = this.mapService.lngLatToCoord(d.coordinates);
+          d.coordinates = _this4.mapService.coordToAMap2RelativeCoordinates(d.coordinates, layerCenter);
+        });
       }
     }
   }, {

package/es/plugins/LayerModelPlugin.js

@@ -21,7 +21,7 @@ var LayerModelPlugin = (_dec = injectable(), _dec(_class = /*#__PURE__*/function
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
-              // 更新Model 配置项
+              // 更新Model 配置项 style options
               layer.prepareBuildModel();
               // 初始化 Model
               _context.next = 3;
@@ -69,6 +69,8 @@ var LayerModelPlugin = (_dec = injectable(), _dec(_class = /*#__PURE__*/function
               _context3.next = 2;
               return this.build(layer);
             case 2:
+              layer.styleNeedUpdate = false;
+            case 3:
             case "end":
               return _context3.stop();
           }
@@ -140,6 +142,16 @@ var LayerModelPlugin = (_dec = injectable(), _dec(_class = /*#__PURE__*/function
           return _ref2.apply(this, arguments);
         };
       }());
+      layer.hooks.beforeRender.tap('LayerModelPlugin', function () {
+        // 判断数据映射是否需要更新
+        if (layer.styleNeedUpdate) {
+          _this.prepareLayerModel(layer).then(function () {
+            layer.styleNeedUpdate = false;
+            layer.renderLayers();
+          });
+        }
+        layer.styleNeedUpdate = false;
+      });
     }
   }]);
   return LayerModelPlugin;