@antv/l7-layers 2.20.5 → 2.20.8

package/es/line/models/arc.js

@@ -1,5 +1,4 @@
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
@@ -13,20 +12,12 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 import { AttributeType, gl } from '@antv/l7-core';
 import { lodashUtil, rgb2arr } from '@antv/l7-utils';
 import BaseModel from "../../core/BaseModel";
+import { ShaderLocation } from "../../core/CommonStyleAttribute";
 import { LineArcTriangulation } from "../../core/triangulation";
-// arc dash line
-/* babel-plugin-inline-import '../shaders/dash/arc_dash_frag.glsl' */
-var arc_dash_frag = "varying vec4 v_dash_array;\nvarying vec4 v_color;\nvarying float v_distance_ratio;\n\nuniform float segmentNumber;\n\n\n#pragma include \"picking\"\n\nvoid main() {\n  gl_FragColor = v_color;\n\n  float flag = 0.;\n  float dashLength = mod(v_distance_ratio, v_dash_array.x + v_dash_array.y + v_dash_array.z + v_dash_array.w);\n  if(dashLength < v_dash_array.x || (dashLength > (v_dash_array.x + v_dash_array.y) && dashLength <  v_dash_array.x + v_dash_array.y + v_dash_array.z)) {\n    flag = 1.;\n  };\n  gl_FragColor.a *=flag;\n  \n  gl_FragColor = filterColor(gl_FragColor);\n}";
-/* babel-plugin-inline-import '../shaders/dash/arc_dash_vert.glsl' */
-var arc_dash_vert = "\nattribute vec4 a_Color;\nattribute vec3 a_Position;\nattribute vec4 a_Instance;\nattribute float a_Size;\nuniform mat4 u_ModelMatrix;\n\nuniform float segmentNumber;\nvarying vec4 v_color;\n\n\nuniform vec4 u_dash_array: [10.0, 5., 0, 0];\nuniform float u_lineDir: 1.0;\nvarying vec4 v_dash_array;\nvarying float v_distance_ratio;\n#pragma include \"projection\"\n#pragma include \"project\"\n#pragma include \"picking\"\n\nfloat bezier3(vec3 arr, float t) {\n  float ut = 1. - t;\n  return (arr.x * ut + arr.y * t) * ut + (arr.y * ut + arr.z * t) * t;\n}\nvec2 midPoint(vec2 source, vec2 target, float arcThetaOffset) {\n  vec2 center = target - source;\n  float r = length(center);\n  float theta = atan(center.y, center.x);\n  float thetaOffset = arcThetaOffset;\n  float r2 = r / 2.0 / cos(thetaOffset);\n  float theta2 = theta + thetaOffset;\n  vec2 mid = vec2(r2*cos(theta2) + source.x, r2*sin(theta2) + source.y);\n  if(u_lineDir == 1.0) { // \u6B63\u5411\n    return mid;\n  } else { // \u9006\u5411\n    // (mid + vmin)/2 = (s + t)/2\n    vec2 vmid = source + target - mid;\n    return vmid;\n  }\n  // return mid;\n}\nfloat getSegmentRatio(float index) {\n  // dash: index / (segmentNumber - 1.);\n  // normal: smoothstep(0.0, 1.0, index / (segmentNumber - 1.));\n  return index / (segmentNumber - 1.);\n}\nvec2 interpolate (vec2 source, vec2 target, float t, float arcThetaOffset) {\n  // if the angularDist is PI, linear interpolation is applied. otherwise, use spherical interpolation\n  vec2 mid = midPoint(source, target, arcThetaOffset);\n  vec3 x = vec3(source.x, mid.x, target.x);\n  vec3 y = vec3(source.y, mid.y, target.y);\n  return vec2(bezier3(x ,t), bezier3(y,t));\n}\nvec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n  vec2 offset = dir_screenspace * offset_direction * setPickingSize(a_Size) / 2.0;\n  return offset;\n}\nvec2 getNormal(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n   return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);\n}\n\nvoid main() {\n  v_color = vec4(a_Color.xyz, a_Color.w * opacity);\n  \n  vec2 source = a_Instance.rg;  // \u8D77\u59CB\u70B9\n  vec2 target =  a_Instance.ba; // \u7EC8\u70B9\n  float segmentIndex = a_Position.x;\n  float segmentRatio = getSegmentRatio(segmentIndex);\n\n  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));\n  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);\n\n  vec2 s = source;\n  vec2 t = target;\n  \n  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n    s = unProjCustomCoord(source);\n    t = unProjCustomCoord(target);\n  }\n  float total_Distance = pixelDistance(s, t) / 2.0 * PI;\n  v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / total_Distance;\n\n  v_distance_ratio = segmentIndex / segmentNumber;\n\n  vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio, thetaOffset), 0.0, 1.0));\n  vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio, thetaOffset), 0.0, 1.0));\n \n  \n  vec2 offset = project_pixel(getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y));\n\n  gl_Position = project_common_position_to_clipspace_v2(vec4(curr.xy + offset, 0, 1.0));\n\n  gl_PointSize = 5.0;\n  setPickingColor(a_PickingColor);\n}\n"; // arc normal line
-/* babel-plugin-inline-import '../shaders/line_arc_frag.glsl' */
-var arc_line_frag = "\n#define Animate 0.0\n#define LineTexture 1.0\nuniform float u_textureBlend;\nuniform float u_blur : 0.9;\nuniform float u_line_type: 0.0;\n// varying vec2 v_normal;\nvarying vec4 v_dash_array;\nvarying vec4 v_color;\n\nuniform float u_time;\nuniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\n\nuniform float u_line_texture;\nuniform sampler2D u_texture;\nuniform vec2 u_textSize;\n\nuniform float segmentNumber;\nvarying vec2 v_iconMapUV;\nvarying vec4 v_lineData;\n\n\n#pragma include \"picking\"\n\nvoid main() {\n  float animateSpeed = 0.0; // \u8FD0\u52A8\u901F\u5EA6\n  gl_FragColor = v_color;\n  \n\n  if(u_animate.x == Animate && u_line_texture != LineTexture) {\n      animateSpeed = u_time / u_animate.y;\n      float alpha =1.0 - fract( mod(1.0- v_lineData.b, u_animate.z)* (1.0/ u_animate.z) + u_time / u_animate.y);\n      alpha = (alpha + u_animate.w -1.0) / u_animate.w;\n      // alpha = smoothstep(0., 1., alpha);\n      alpha = clamp(alpha, 0.0, 1.0);\n      gl_FragColor.a *= alpha;\n  }\n\n  // \u5F53\u5B58\u5728\u8D34\u56FE\u65F6\u5728\u5E95\u8272\u4E0A\u8D34\u4E0A\u8D34\u56FE\n  if(u_line_texture == LineTexture) { // while load texture\n    float arcRadio = smoothstep( 0.0, 1.0, (v_lineData.r / segmentNumber));\n    // float arcRadio = smoothstep( 0.0, 1.0, d_distance_ratio);\n\n    float count = v_lineData.g; // \u8D34\u56FE\u5728\u5F27\u7EBF\u4E0A\u91CD\u590D\u7684\u6570\u91CF\n\n    float time = 0.0;\n    if(u_animate.x == Animate) {\n      time = u_time / u_animate.y;\n    }\n    float redioCount = arcRadio * count;\n\n    float u = fract(redioCount - time);\n    float v = v_lineData.a; // \u6A2A\u5411 v\n    vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.;\n\n    vec4 pattern = texture2D(u_texture, uv);\n\n    if(u_animate.x == Animate) {\n      float currentPlane = floor(redioCount - time);\n      float textureStep = floor(count * u_animate.z);\n      float a = mod(currentPlane, textureStep);\n      if(a < textureStep - 1.0) {\n        pattern = vec4(0.0);\n      }\n    }\n\n    if(u_textureBlend == 0.0) { // normal\n      pattern.a = 0.0;\n      gl_FragColor = filterColor(gl_FragColor + pattern);\n    } else { // replace\n        pattern.a *= v_color.a;\n        if(gl_FragColor.a <= 0.0) {\n          pattern.a = 0.0;\n        }\n        gl_FragColor = filterColor(pattern);\n    }\n    \n  } else {\n     gl_FragColor = filterColor(gl_FragColor);\n  }\n}";
-/* babel-plugin-inline-import '../shaders/line_arc_vert.glsl' */
-var arc_line_vert = "#define Animate 0.0\n#define LineTexture 1.0\n\nattribute vec4 a_Color;\nattribute vec3 a_Position;\nattribute vec4 a_Instance;\nattribute float a_Size;\nuniform mat4 u_ModelMatrix;\n\nuniform float segmentNumber;\nuniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\nvarying vec4 v_color;\n\nuniform float u_lineDir: 1.0;\n\nuniform float u_icon_step: 100;\nuniform float u_line_texture: 0.0;\nattribute vec2 a_iconMapUV;\nvarying vec2 v_iconMapUV;\nvarying vec4 v_lineData;\nvarying vec2 v_distance_ratio;\n\n\n#pragma include \"projection\"\n#pragma include \"project\"\n#pragma include \"picking\"\n\nfloat bezier3(vec3 arr, float t) {\n  float ut = 1. - t;\n  return (arr.x * ut + arr.y * t) * ut + (arr.y * ut + arr.z * t) * t;\n}\nvec2 midPoint(vec2 source, vec2 target, float arcThetaOffset) {\n  vec2 center = target - source;\n  float r = length(center);\n  float theta = atan(center.y, center.x);\n  float thetaOffset = arcThetaOffset;\n  float r2 = r / 2.0 / cos(thetaOffset);\n  float theta2 = theta + thetaOffset;\n  vec2 mid = vec2(r2*cos(theta2) + source.x, r2*sin(theta2) + source.y);\n  if(u_lineDir == 1.0) { // \u6B63\u5411\n    return mid;\n  } else { // \u9006\u5411\n    // (mid + vmin)/2 = (s + t)/2\n    vec2 vmid = source + target - mid;\n    return vmid;\n  }\n  // return mid;\n}\nfloat getSegmentRatio(float index) {\n    // dash: index / (segmentNumber - 1.);\n    // normal: smoothstep(0.0, 1.0, index / (segmentNumber - 1.));\n    return smoothstep(0.0, 1.0, index / (segmentNumber - 1.));\n    //  return index / (segmentNumber - 1.);\n}\nvec2 interpolate (vec2 source, vec2 target, float t, float arcThetaOffset) {\n  // if the angularDist is PI, linear interpolation is applied. otherwise, use spherical interpolation\n  vec2 mid = midPoint(source, target, arcThetaOffset);\n  vec3 x = vec3(source.x, mid.x, target.x);\n  vec3 y = vec3(source.y, mid.y, target.y);\n  return vec2(bezier3(x ,t), bezier3(y,t));\n}\nvec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n  vec2 offset = dir_screenspace * offset_direction * setPickingSize(a_Size) / 2.0;\n  return offset;\n}\nvec2 getNormal(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n   return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);\n}\n\nvoid main() {\n  v_color = a_Color;\n  v_color.a = v_color.a * opacity;\n\n  vec2 source = a_Instance.rg;  // \u8D77\u59CB\u70B9\n  vec2 target =  a_Instance.ba; // \u7EC8\u70B9\n  float segmentIndex = a_Position.x;\n  float segmentRatio = getSegmentRatio(segmentIndex);\n\n  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));\n  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);\n  float d_distance_ratio;\n  \n  if(u_animate.x == Animate) {\n      d_distance_ratio = segmentIndex / segmentNumber;\n      if(u_lineDir != 1.0) {\n        d_distance_ratio = 1.0 - d_distance_ratio;\n      }\n  }\n\n v_lineData.b = d_distance_ratio;\n\n  vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio, thetaOffset), 0.0, 1.0));\n  vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio, thetaOffset), 0.0, 1.0));\n\n  \n  vec2 offset = project_pixel(getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y));\n\n\n  float d_segmentIndex = a_Position.x + 1.0; // \u5F53\u524D\u9876\u70B9\u5728\u5F27\u7EBF\u4E2D\u6240\u5904\u7684\u5206\u6BB5\u4F4D\u7F6E\n v_lineData.r = d_segmentIndex;\n\n  if(LineTexture == u_line_texture) { // \u5F00\u542F\u8D34\u56FE\u6A21\u5F0F\n\n    float arcDistrance = length(source - target); // \u8D77\u59CB\u70B9\u548C\u7EC8\u70B9\u7684\u8DDD\u79BB\n    if(u_CoordinateSystem == COORDINATE_SYSTEM_P20) { // amap\n      arcDistrance *= 1000000.0;\n    }\n    if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) { // mapbox\n      // arcDistrance *= 8.0;\n      arcDistrance = project_pixel_allmap(arcDistrance);\n    }\n    v_iconMapUV = a_iconMapUV;\n\n    float pixelLen = project_pixel_texture(u_icon_step); // \u8D34\u56FE\u6CBF\u5F27\u7EBF\u65B9\u5411\u7684\u957F\u5EA6 - \u968F\u5730\u56FE\u7F29\u653E\u6539\u53D8\n    float texCount = floor(arcDistrance/pixelLen); // \u8D34\u56FE\u5728\u5F27\u7EBF\u4E0A\u91CD\u590D\u7684\u6570\u91CF\n    v_lineData.g = texCount;\n\n    float lineOffsetWidth = length(offset + offset * sign(a_Position.y)); // \u7EBF\u6A2A\u5411\u504F\u79FB\u7684\u8DDD\u79BB\n    float linePixelSize = project_pixel(a_Size); // \u5B9A\u70B9\u4F4D\u7F6E\u504F\u79FB\n    v_lineData.a = lineOffsetWidth/linePixelSize; // \u7EBF\u56FE\u5C42\u8D34\u56FE\u90E8\u5206\u7684 v \u5750\u6807\u503C\n  }\n\n  gl_Position = project_common_position_to_clipspace_v2(vec4(curr.xy + offset, 0, 1.0));\n\n  setPickingColor(a_PickingColor);\n}\n"; // arc linear line
-/* babel-plugin-inline-import '../shaders/linear/arc_linear_frag.glsl' */
-var arc_linear_frag = "varying vec4 v_color;\n\n#pragma include \"picking\"\n\nvoid main() {\n// \u5F53\u524D\u9876\u70B9\u5728\u5F27\u7EBF\u4E2D\u6240\u5904\u7684\u5206\u6BB5\u4F4D\u7F6E\n\n  gl_FragColor = v_color;\n  gl_FragColor = filterColor(gl_FragColor);\n}";
-/* babel-plugin-inline-import '../shaders/linear/arc_linear_vert.glsl' */
-var arc_linear_vert = "\nattribute vec4 a_Color;\nattribute vec3 a_Position;\nattribute vec4 a_Instance;\nattribute float a_Size;\nuniform mat4 u_ModelMatrix;\n\nuniform float segmentNumber;\nvarying vec4 v_color;\nvarying float v_segmentIndex;\n\nuniform float u_lineDir: 1.0;\n\nuniform vec4 u_sourceColor;\nuniform vec4 u_targetColor;\n\n\n\n\n#pragma include \"projection\"\n#pragma include \"project\"\n#pragma include \"picking\"\n\nfloat bezier3(vec3 arr, float t) {\n  float ut = 1. - t;\n  return (arr.x * ut + arr.y * t) * ut + (arr.y * ut + arr.z * t) * t;\n}\nvec2 midPoint(vec2 source, vec2 target, float arcThetaOffset) {\n  vec2 center = target - source;\n  float r = length(center);\n  float theta = atan(center.y, center.x);\n  float thetaOffset = arcThetaOffset;\n  float r2 = r / 2.0 / cos(thetaOffset);\n  float theta2 = theta + thetaOffset;\n  vec2 mid = vec2(r2*cos(theta2) + source.x, r2*sin(theta2) + source.y);\n  if(u_lineDir == 1.0) { // \u6B63\u5411\n    return mid;\n  } else { // \u9006\u5411\n    // (mid + vmin)/2 = (s + t)/2\n    vec2 vmid = source + target - mid;\n    return vmid;\n  }\n  // return mid;\n}\nfloat getSegmentRatio(float index) {\n    return smoothstep(0.0, 1.0, index / (segmentNumber - 1.));\n}\nvec2 interpolate (vec2 source, vec2 target, float t, float arcThetaOffset) {\n  // if the angularDist is PI, linear interpolation is applied. otherwise, use spherical interpolation\n  vec2 mid = midPoint(source, target, arcThetaOffset);\n  vec3 x = vec3(source.x, mid.x, target.x);\n  vec3 y = vec3(source.y, mid.y, target.y);\n  return vec2(bezier3(x ,t), bezier3(y,t));\n}\nvec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n  vec2 offset = dir_screenspace * offset_direction * setPickingSize(a_Size) / 2.0;\n  return offset;\n}\nvec2 getNormal(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n   return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);\n}\n\nvoid main() {\n  v_color = a_Color;\n\n  vec2 source = a_Instance.rg;  // \u8D77\u59CB\u70B9\n  vec2 target =  a_Instance.ba; // \u7EC8\u70B9\n  float segmentIndex = a_Position.x;\n  float segmentRatio = getSegmentRatio(segmentIndex);\n\n  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));\n  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);\n  float d_distance_ratio;\n  vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio, thetaOffset), 0.0, 1.0));\n  vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio, thetaOffset), 0.0, 1.0));\n  // v_normal = getNormal((next.xy - curr.xy) * indexDir, a_Position.y);\n  //unProjCustomCoord\n  \n  vec2 offset = project_pixel(getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y));\n\n\n  float d_segmentIndex = a_Position.x + 1.0; // \u5F53\u524D\u9876\u70B9\u5728\u5F27\u7EBF\u4E2D\u6240\u5904\u7684\u5206\u6BB5\u4F4D\u7F6E\n\n  v_color = mix(u_sourceColor, u_targetColor, d_segmentIndex/segmentNumber);\n  v_color.a *= opacity;\n\n  gl_Position = project_common_position_to_clipspace_v2(vec4(curr.xy + offset, 0, 1.0));\n\n  setPickingColor(a_PickingColor);\n}\n";
+/* babel-plugin-inline-import '../shaders/arc/line_arc_frag.glsl' */
+var arc_line_frag = "\n#define Animate 0.0\n#define LineTexture 1.0\nuniform sampler2D u_texture;\nlayout(std140) uniform commonUniorm {\n  vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\n  vec4 u_dash_array;\n  vec4 u_sourceColor;\n  vec4 u_targetColor;\n  vec2 u_textSize;\n  float segmentNumber;\n  float u_lineDir: 1.0;\n  float u_icon_step: 100;\n  float u_line_texture: 0.0;\n  float u_textureBlend;\n  float u_blur : 0.9;\n  float u_line_type: 0.0;\n  float u_time;\n  float u_linearColor: 0.0;\n};\nin vec2 v_iconMapUV;\nin vec4 v_lineData;\nin vec4 v_color;\n//dash\nin vec4 v_dash_array;\nin float v_distance_ratio;\n\nout vec4 outputColor;\n#pragma include \"picking\"\n\nvoid main() {\n  if(u_dash_array!=vec4(0.0)){\n    float dashLength = mod(v_distance_ratio, v_dash_array.x + v_dash_array.y + v_dash_array.z + v_dash_array.w);\n    if(!(dashLength < v_dash_array.x || (dashLength > (v_dash_array.x + v_dash_array.y) && dashLength <  v_dash_array.x + v_dash_array.y + v_dash_array.z))) {\n      discard;\n    };\n  }\n  float animateSpeed = 0.0; // \u8FD0\u52A8\u901F\u5EA6\n  outputColor = v_color;\n  if(u_animate.x == Animate && u_line_texture != LineTexture) {\n      animateSpeed = u_time / u_animate.y;\n      float alpha =1.0 - fract( mod(1.0- v_lineData.b, u_animate.z)* (1.0/ u_animate.z) + u_time / u_animate.y);\n      alpha = (alpha + u_animate.w -1.0) / u_animate.w;\n      // alpha = smoothstep(0., 1., alpha);\n      alpha = clamp(alpha, 0.0, 1.0);\n      outputColor.a *= alpha;\n  }\n\n  // \u5F53\u5B58\u5728\u8D34\u56FE\u65F6\u5728\u5E95\u8272\u4E0A\u8D34\u4E0A\u8D34\u56FE\n  if(u_line_texture == LineTexture) { // while load texture\n    float arcRadio = smoothstep( 0.0, 1.0, (v_lineData.r / segmentNumber));\n    // float arcRadio = smoothstep( 0.0, 1.0, d_distance_ratio);\n\n    float count = v_lineData.g; // \u8D34\u56FE\u5728\u5F27\u7EBF\u4E0A\u91CD\u590D\u7684\u6570\u91CF\n\n    float time = 0.0;\n    if(u_animate.x == Animate) {\n      time = u_time / u_animate.y;\n    }\n    float redioCount = arcRadio * count;\n\n    float u = fract(redioCount - time);\n    float v = v_lineData.a; // \u6A2A\u5411 v\n    vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.;\n\n    vec4 pattern = texture(SAMPLER_2D(u_texture), uv);\n\n    if(u_animate.x == Animate) {\n      float currentPlane = floor(redioCount - time);\n      float textureStep = floor(count * u_animate.z);\n      float a = mod(currentPlane, textureStep);\n      if(a < textureStep - 1.0) {\n        pattern = vec4(0.0);\n      }\n    }\n\n    if(u_textureBlend == 0.0) { // normal\n      pattern.a = 0.0;\n      outputColor = filterColor(outputColor + pattern);\n    } else { // replace\n        pattern.a *= v_color.a;\n        if(outputColor.a <= 0.0) {\n          pattern.a = 0.0;\n        }\n        outputColor = filterColor(pattern);\n    }\n    \n  } else {\n     outputColor = filterColor(outputColor);\n  }\n}";
+/* babel-plugin-inline-import '../shaders/arc/line_arc_vert.glsl' */
+var arc_line_vert = "#define Animate 0.0\n#define LineTexture 1.0\nlayout(location = 0) in vec3 a_Position;\nlayout(location = 1) in vec4 a_Color;\nlayout(location = 9) in float a_Size;\nlayout(location = 12) in vec4 a_Instance;\nlayout(location = 14) in vec2 a_iconMapUV;\n\nlayout(std140) uniform commonUniorm {\n  vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\n  vec4 u_dash_array;\n  vec4 u_sourceColor;\n  vec4 u_targetColor;\n  vec2 u_textSize;\n  float segmentNumber;\n  float u_lineDir: 1.0;\n  float u_icon_step: 100;\n  float u_line_texture: 0.0;\n  float u_textureBlend;\n  float u_blur : 0.9;\n  float u_line_type: 0.0;\n  float u_time;\n  float u_linearColor: 0.0;\n};\nout vec4 v_color;\nout vec2 v_iconMapUV;\nout vec4 v_lineData;\n//dash\nout vec4 v_dash_array;\nout float v_distance_ratio;\n\n\n#pragma include \"projection\"\n#pragma include \"project\"\n#pragma include \"picking\"\n\nfloat bezier3(vec3 arr, float t) {\n  float ut = 1. - t;\n  return (arr.x * ut + arr.y * t) * ut + (arr.y * ut + arr.z * t) * t;\n}\nvec2 midPoint(vec2 source, vec2 target, float arcThetaOffset) {\n  vec2 center = target - source;\n  float r = length(center);\n  float theta = atan(center.y, center.x);\n  float thetaOffset = arcThetaOffset;\n  float r2 = r / 2.0 / cos(thetaOffset);\n  float theta2 = theta + thetaOffset;\n  vec2 mid = vec2(r2*cos(theta2) + source.x, r2*sin(theta2) + source.y);\n  if(u_lineDir == 1.0) { // \u6B63\u5411\n    return mid;\n  } else { // \u9006\u5411\n    // (mid + vmin)/2 = (s + t)/2\n    vec2 vmid = source + target - mid;\n    return vmid;\n  }\n  // return mid;\n}\nfloat getSegmentRatio(float index) {\n    // dash: index / (segmentNumber - 1.);\n    // normal: smoothstep(0.0, 1.0, index / (segmentNumber - 1.));\n    return smoothstep(0.0, 1.0, index / (segmentNumber - 1.));\n    //  return index / (segmentNumber - 1.);\n}\nvec2 interpolate (vec2 source, vec2 target, float t, float arcThetaOffset) {\n  // if the angularDist is PI, linear interpolation is applied. otherwise, use spherical interpolation\n  vec2 mid = midPoint(source, target, arcThetaOffset);\n  vec3 x = vec3(source.x, mid.x, target.x);\n  vec3 y = vec3(source.y, mid.y, target.y);\n  return vec2(bezier3(x ,t), bezier3(y,t));\n}\nvec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n  vec2 offset = dir_screenspace * offset_direction * setPickingSize(a_Size) / 2.0;\n  return offset;\n}\nvec2 getNormal(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n   dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n   return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);\n}\n\nvoid main() {\n  //vs\u4E2D\u8BA1\u7B97\u6E10\u53D8\u8272\n  if(u_linearColor==1.0){\n    float d_segmentIndex = a_Position.x + 1.0; // \u5F53\u524D\u9876\u70B9\u5728\u5F27\u7EBF\u4E2D\u6240\u5904\u7684\u5206\u6BB5\u4F4D\u7F6E\n    v_color = mix(u_sourceColor, u_targetColor, d_segmentIndex/segmentNumber);\n  }\n  else{\n    v_color = a_Color;\n  }\n  v_color.a = v_color.a * opacity;\n\n  vec2 source = a_Instance.rg;  // \u8D77\u59CB\u70B9\n  vec2 target =  a_Instance.ba; // \u7EC8\u70B9\n\n\n\n  float segmentIndex = a_Position.x;\n  float segmentRatio = getSegmentRatio(segmentIndex);\n\n  //\u8BA1\u7B97dashArray\u548CdistanceRatio \u8F93\u51FA\u5230\u7247\u5143\n  vec2 s = source;\n  vec2 t = target;\n  if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n    s = unProjCustomCoord(source);\n    t = unProjCustomCoord(target);\n  }\n  float total_Distance = pixelDistance(s, t) / 2.0 * PI;\n  v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / total_Distance;\n  v_distance_ratio = segmentIndex / segmentNumber;\n\n  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));\n  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);\n  float d_distance_ratio;\n  \n  if(u_animate.x == Animate) {\n      d_distance_ratio = segmentIndex / segmentNumber;\n      if(u_lineDir != 1.0) {\n        d_distance_ratio = 1.0 - d_distance_ratio;\n      }\n  }\n\n  v_lineData.b = d_distance_ratio;\n\n  vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio, thetaOffset), 0.0, 1.0));\n  vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio, thetaOffset), 0.0, 1.0));\n\n  \n  vec2 offset = project_pixel(getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y));\n\n\n  float d_segmentIndex = a_Position.x + 1.0; // \u5F53\u524D\u9876\u70B9\u5728\u5F27\u7EBF\u4E2D\u6240\u5904\u7684\u5206\u6BB5\u4F4D\u7F6E\n  v_lineData.r = d_segmentIndex;\n\n  if(LineTexture == u_line_texture) { // \u5F00\u542F\u8D34\u56FE\u6A21\u5F0F\n\n    float arcDistrance = length(source - target); // \u8D77\u59CB\u70B9\u548C\u7EC8\u70B9\u7684\u8DDD\u79BB\n    if(u_CoordinateSystem == COORDINATE_SYSTEM_P20) { // amap\n      arcDistrance *= 1000000.0;\n    }\n    if(u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT || u_CoordinateSystem == COORDINATE_SYSTEM_LNGLAT_OFFSET) { // mapbox\n      // arcDistrance *= 8.0;\n      arcDistrance = project_pixel_allmap(arcDistrance);\n    }\n    v_iconMapUV = a_iconMapUV;\n\n    float pixelLen = project_pixel_texture(u_icon_step); // \u8D34\u56FE\u6CBF\u5F27\u7EBF\u65B9\u5411\u7684\u957F\u5EA6 - \u968F\u5730\u56FE\u7F29\u653E\u6539\u53D8\n    float texCount = floor(arcDistrance/pixelLen); // \u8D34\u56FE\u5728\u5F27\u7EBF\u4E0A\u91CD\u590D\u7684\u6570\u91CF\n    v_lineData.g = texCount;\n\n    float lineOffsetWidth = length(offset + offset * sign(a_Position.y)); // \u7EBF\u6A2A\u5411\u504F\u79FB\u7684\u8DDD\u79BB\n    float linePixelSize = project_pixel(a_Size); // \u5B9A\u70B9\u4F4D\u7F6E\u504F\u79FB\n    v_lineData.a = lineOffsetWidth/linePixelSize; // \u7EBF\u56FE\u5C42\u8D34\u56FE\u90E8\u5206\u7684 v \u5750\u6807\u503C\n  }\n\n  gl_Position = project_common_position_to_clipspace_v2(vec4(curr.xy + offset, 0, 1.0));\n\n  setPickingColor(a_PickingColor);\n}\n";
 var lineStyleObj = {
   solid: 0.0,
   dash: 1.0
@@ -59,15 +50,14 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
         width: 1024,
         height: _this.iconService.canvasHeight || 128
       });
+      _this.textures = [_this.texture];
     });
     return _this;
   }
   _createClass(ArcModel, [{
-    key: "getUninforms",
-    value: function getUninforms() {
+    key: "getCommonUniformsInfo",
+    value: function getCommonUniformsInfo() {
       var _ref = this.layer.getLayerConfig(),
-        _ref$opacity = _ref.opacity,
-        opacity = _ref$opacity === void 0 ? 1 : _ref$opacity,
         sourceColor = _ref.sourceColor,
         targetColor = _ref.targetColor,
         _ref$textureBlend = _ref.textureBlend,
@@ -84,8 +74,14 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
         iconStep = _ref$iconStep === void 0 ? 100 : _ref$iconStep,
         _ref$segmentNumber = _ref.segmentNumber,
         segmentNumber = _ref$segmentNumber === void 0 ? 30 : _ref$segmentNumber;
-      if (dashArray.length === 2) {
-        dashArray.push(0, 0);
+      var _ref2 = this.layer.getLayerConfig(),
+        animateOption = _ref2.animateOption;
+      var u_dash_array = dashArray;
+      if (lineType !== 'dash') {
+        u_dash_array = [0, 0];
+      }
+      if (u_dash_array.length === 2) {
+        u_dash_array.push(0, 0);
       }
 
       // 转化渐变色
@@ -100,36 +96,37 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
       if (this.rendererService.getDirty()) {
         this.texture.bind();
       }
-      return _objectSpread({
-        u_textureBlend: textureBlend === 'normal' ? 0.0 : 1.0,
+      var commonOptions = {
+        u_animate: this.animateOption2Array(animateOption),
+        u_dash_array: u_dash_array,
+        u_sourceColor: sourceColorArr,
+        u_targetColor: targetColorArr,
+        u_textSize: [1024, this.iconService.canvasHeight || 128],
         segmentNumber: segmentNumber,
-        u_line_type: lineStyleObj[lineType || 'solid'],
-        u_dash_array: dashArray,
-        u_blur: 0.9,
         u_lineDir: forward ? 1 : -1,
-        // 纹理支持参数
-        u_texture: this.texture,
-        // 贴图
+        u_icon_step: iconStep,
         u_line_texture: lineTexture ? 1.0 : 0.0,
         // 传入线的标识
-        u_icon_step: iconStep,
-        u_textSize: [1024, this.iconService.canvasHeight || 128],
+        u_textureBlend: textureBlend === 'normal' ? 0.0 : 1.0,
+        u_blur: 0.9,
+        u_line_type: lineStyleObj[lineType || 'solid'],
+        u_time: this.layer.getLayerAnimateTime() || 0,
+        // // 纹理支持参数
+        // u_texture: this.texture, // 贴图
         // 渐变色支持参数
-        u_linearColor: useLinearColor,
-        u_sourceColor: sourceColorArr,
-        u_targetColor: targetColorArr
-      }, this.getStyleAttribute());
-    }
-  }, {
-    key: "getAnimateUniforms",
-    value: function getAnimateUniforms() {
-      var _ref2 = this.layer.getLayerConfig(),
-        animateOption = _ref2.animateOption;
-      return {
-        u_animate: this.animateOption2Array(animateOption),
-        u_time: this.layer.getLayerAnimateTime()
+        u_linearColor: useLinearColor
       };
+      var commonBufferInfo = this.getUniformsBufferInfo(commonOptions);
+      return commonBufferInfo;
     }
+
+    // public getAnimateUniforms(): IModelUniform {
+    //   const { animateOption } = this.layer.getLayerConfig() as ILayerConfig;
+    //   return {
+    //     u_animate: this.animateOption2Array(animateOption as IAnimateOption),
+    //     u_time: this.layer.getLayerAnimateTime(),
+    //   };
+    // }
   }, {
     key: "initModels",
     value: function () {
@@ -161,43 +158,24 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
   }, {
     key: "getShaders",
     value: function getShaders() {
-      var _ref3 = this.layer.getLayerConfig(),
-        sourceColor = _ref3.sourceColor,
-        targetColor = _ref3.targetColor,
-        lineType = _ref3.lineType;
-      if (lineType === 'dash') {
-        return {
-          frag: arc_dash_frag,
-          vert: arc_dash_vert,
-          type: 'Dash'
-        };
-      }
-      if (sourceColor && targetColor) {
-        // 分离 linear 功能
-        return {
-          frag: arc_linear_frag,
-          vert: arc_linear_vert,
-          type: 'Linear'
-        };
-      } else {
-        return {
-          frag: arc_line_frag,
-          vert: arc_line_vert,
-          type: ''
-        };
-      }
+      return {
+        frag: arc_line_frag,
+        vert: arc_line_vert,
+        type: ''
+      };
     }
   }, {
     key: "buildModels",
     value: function () {
       var _buildModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-        var _ref4, _ref4$segmentNumber, segmentNumber, _this$getShaders, frag, vert, type, model;
+        var _ref3, _ref3$segmentNumber, segmentNumber, _this$getShaders, frag, vert, type, model;
         return _regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
-              _ref4 = this.layer.getLayerConfig(), _ref4$segmentNumber = _ref4.segmentNumber, segmentNumber = _ref4$segmentNumber === void 0 ? 30 : _ref4$segmentNumber;
+              this.initUniformsBuffer();
+              _ref3 = this.layer.getLayerConfig(), _ref3$segmentNumber = _ref3.segmentNumber, segmentNumber = _ref3$segmentNumber === void 0 ? 30 : _ref3$segmentNumber;
               _this$getShaders = this.getShaders(), frag = _this$getShaders.frag, vert = _this$getShaders.vert, type = _this$getShaders.type; //
-              _context2.next = 4;
+              _context2.next = 5;
               return this.layer.buildLayerModel({
                 moduleName: 'lineArc2d' + type,
                 vertexShader: vert,
@@ -211,10 +189,10 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
                   segmentNumber: segmentNumber
                 }
               });
-            case 4:
+            case 5:
               model = _context2.sent;
               return _context2.abrupt("return", [model]);
-            case 6:
+            case 7:
             case "end":
               return _context2.stop();
           }
@@ -234,6 +212,7 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
         type: AttributeType.Attribute,
         descriptor: {
           name: 'a_Size',
+          shaderLocation: ShaderLocation.SIZE,
           buffer: {
             // give the WebGL driver a hint that this buffer may change
             usage: gl.DYNAMIC_DRAW,
@@ -254,6 +233,7 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
         type: AttributeType.Attribute,
         descriptor: {
           name: 'a_Instance',
+          shaderLocation: 12,
           buffer: {
             usage: gl.STATIC_DRAW,
             data: [],
@@ -270,6 +250,7 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
         type: AttributeType.Attribute,
         descriptor: {
           name: 'a_iconMapUV',
+          shaderLocation: 14,
           buffer: {
             // give the WebGL driver a hint that this buffer may change
             usage: gl.DYNAMIC_DRAW,
@@ -280,12 +261,12 @@ var ArcModel = /*#__PURE__*/function (_BaseModel) {
           update: function update(feature) {
             var iconMap = _this2.iconService.getIconMap();
             var texture = feature.texture;
-            var _ref5 = iconMap[texture] || {
+            var _ref4 = iconMap[texture] || {
                 x: 0,
                 y: 0
               },
-              x = _ref5.x,
-              y = _ref5.y;
+              x = _ref4.x,
+              y = _ref4.y;
             return [x, y];
           }
         }

package/es/line/models/arc_3d.d.ts

@@ -1,9 +1,14 @@
-import { IModel, IModelUniform, ITexture2D } from '@antv/l7-core';
+import type { IModel, ITexture2D } from '@antv/l7-core';
 import BaseModel from '../../core/BaseModel';
 export default class Arc3DModel extends BaseModel {
     protected texture: ITexture2D;
-    getUninforms(): IModelUniform;
-    getAnimateUniforms(): IModelUniform;
+    protected getCommonUniformsInfo(): {
+        uniformsArray: number[];
+        uniformsLength: number;
+        uniformsOption: {
+            [key: string]: any;
+        };
+    };
     initModels(): Promise<IModel[]>;
     clearModels(): void;
     getShaders(): {

package/es/line/models/arc_3d.js

@@ -1,5 +1,4 @@
 import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
 import _createClass from "@babel/runtime/helpers/esm/createClass";
 import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
@@ -16,14 +15,11 @@ import BaseModel from "../../core/BaseModel";
 import { LineArcTriangulation } from "../../core/triangulation";
 import { EARTH_RADIUS } from "../../earth/utils";
 // arc3d line layer
-/* babel-plugin-inline-import '../shaders/line_arc_3d_frag.glsl' */
-var arc3d_line_frag = "#define LineTypeSolid 0.0\n#define LineTypeDash 1.0\n#define Animate 0.0\n#define LineTexture 1.0\n\nuniform float u_textureBlend;\nuniform float u_blur : 0.9;\nuniform float u_line_type: 0.0;\n// varying vec2 v_normal;\nvarying vec4 v_dash_array;\nvarying vec4 v_color;\nvarying vec4 v_line_data;\n\nuniform float u_line_texture: 0.0;\nuniform sampler2D u_texture;\nuniform vec2 u_textSize;\nvarying float v_segmentIndex;\nuniform float segmentNumber;\n\n\nvarying vec2 v_iconMapUV;\n\nuniform float u_time;\nuniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\n\n\n#pragma include \"picking\"\n\nvoid main() {\n  float animateSpeed = 0.0; // \u8FD0\u52A8\u901F\u5EA6\n  float d_distance_ratio = v_line_data.g; // \u5F53\u524D\u70B9\u4F4D\u8DDD\u79BB\u5360\u7EBF\u603B\u957F\u7684\u6BD4\u4F8B\n  gl_FragColor = v_color;\n\n  if(u_line_type == LineTypeDash) {\n    float flag = 0.;\n    float dashLength = mod(d_distance_ratio, v_dash_array.x + v_dash_array.y + v_dash_array.z + v_dash_array.w);\n    if(dashLength < v_dash_array.x || (dashLength > (v_dash_array.x + v_dash_array.y) && dashLength <  v_dash_array.x + v_dash_array.y + v_dash_array.z)) {\n      flag = 1.;\n    }\n    gl_FragColor.a *=flag;\n  }\n\n  if(u_animate.x == Animate && u_line_texture != LineTexture) {\n      animateSpeed = u_time / u_animate.y;\n      float alpha =1.0 - fract( mod(1.0- d_distance_ratio, u_animate.z)* (1.0/ u_animate.z) + u_time / u_animate.y);\n\n      alpha = (alpha + u_animate.w -1.0) / u_animate.w;\n      // alpha = smoothstep(0., 1., alpha);\n      alpha = clamp(alpha, 0.0, 1.0);\n      gl_FragColor.a *= alpha;\n\n      // u_animate \n      // x enable\n      // y duration\n      // z interval\n      // w trailLength\n  }\n\n  if(u_line_texture == LineTexture && u_line_type != LineTypeDash) { // while load texture\n    // float arcRadio = smoothstep( 0.0, 1.0, (v_segmentIndex / segmentNumber));\n    float arcRadio = v_segmentIndex / (segmentNumber - 1.0);\n    float count = v_line_data.b; // // \u8D34\u56FE\u5728\u5F27\u7EBF\u4E0A\u91CD\u590D\u7684\u6570\u91CF\n\n    float time = 0.0;\n    if(u_animate.x == Animate) {\n      time = u_time / u_animate.y;\n    }\n    float redioCount = arcRadio * count;\n\n    float u = fract(redioCount - time);\n\n    float v = v_line_data.a;  // \u7EBF\u56FE\u5C42\u8D34\u56FE\u90E8\u5206\u7684 v \u5750\u6807\u503C\n    vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.;\n    vec4 pattern = texture2D(u_texture, uv);\n\n    if(u_animate.x == Animate) {\n      float currentPlane = floor(redioCount - time);\n      float textureStep = floor(count * u_animate.z);\n      float a = mod(currentPlane, textureStep);\n      if(a < textureStep - 1.0) {\n        pattern = vec4(0.0);\n      }\n    }\n\n    if(u_textureBlend == 0.0) { // normal\n      pattern.a = 0.0;\n      gl_FragColor = filterColor(gl_FragColor + pattern);\n    } else { // replace\n        pattern.a *= v_color.a;\n        if(gl_FragColor.a <= 0.0) {\n          pattern.a = 0.0;\n          discard;\n        } else {\n          gl_FragColor = filterColor(pattern);\n        }\n    }\n\n  } else {\n    gl_FragColor = filterColor(gl_FragColor);\n  }\n}\n";
-/* babel-plugin-inline-import '../shaders/line_arc_3d_vert.glsl' */
-var arc3d_line_vert = "#define LineTypeSolid 0.0\n#define LineTypeDash 1.0\n#define Animate 0.0\n#define LineTexture 1.0\nattribute vec3 a_Position;\nattribute vec4 a_Instance;\nattribute vec4 a_Color;\nattribute float a_Size;\n\nuniform float u_globel;\nuniform float u_globel_radius;\nuniform float u_global_height: 10;\nuniform mat4 u_ModelMatrix;\n\nuniform float segmentNumber;\nuniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\nvarying vec4 v_color;\n\nuniform float u_line_type: 0.0;\nuniform vec4 u_dash_array: [10.0, 5., 0, 0];\nvarying vec4 v_dash_array;\n\nuniform float u_icon_step: 100;\nuniform float u_line_texture: 0.0;\nvarying float v_segmentIndex;\n\nattribute vec2 a_iconMapUV;\nvarying vec2 v_iconMapUV;\nvarying vec4 v_line_data;\n\n#pragma include \"projection\"\n#pragma include \"project\"\n#pragma include \"picking\"\n\nfloat maps (float value, float start1, float stop1, float start2, float stop2) {\n  return start2 + (stop2 - start2) * ((value - start1) / (stop1 - start1));\n}\n\nfloat getSegmentRatio(float index) {\n  return smoothstep(0.0, 1.0, index / (segmentNumber - 1.0));\n}\n\nfloat paraboloid(vec2 source, vec2 target, float ratio) {\n  vec2 x = mix(source, target, ratio);\n  vec2 center = mix(source, target, 0.5);\n  float dSourceCenter = distance(source, center);\n  float dXCenter = distance(x, center);\n  return (dSourceCenter + dXCenter) * (dSourceCenter - dXCenter);\n}\n\nvec3 getPos(vec2 source, vec2 target, float segmentRatio) {\n  float vertex_height = paraboloid(source, target, segmentRatio);\n\n  return vec3(\n    mix(source, target, segmentRatio),\n    sqrt(max(0.0, vertex_height))\n  );\n}\nvec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n  dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n\n  vec2 offset = dir_screenspace * offset_direction * setPickingSize(a_Size) / 2.0;\n\n  return offset;\n}\nvec2 getNormal(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n  dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n  return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);\n}\n\nfloat torad(float deg) {\n  return (deg / 180.0) * acos(-1.0);\n}\n\nvec3 lglt2xyz(vec2 lnglat) {\n  float pi = 3.1415926;\n  // + Math.PI/2 \u662F\u4E3A\u4E86\u5BF9\u9F50\u5750\u6807\n  float lng = torad(lnglat.x) + pi / 2.0;\n  float lat = torad(lnglat.y);\n\n  // \u624B\u52A8\u589E\u52A0\u4E00\u4E9B\u504F\u79FB\uFF0C\u51CF\u8F7B\u9762\u7684\u51B2\u7A81\n  float radius = u_globel_radius;\n\n  float z = radius * cos(lat) * cos(lng);\n  float x = radius * cos(lat) * sin(lng);\n  float y = radius * sin(lat);\n  return vec3(x, y, z);\n}\n\nvoid main() {\n\n  v_color = a_Color;\n  v_color.a = v_color.a * opacity;\n  vec2 source = project_position(vec4(a_Instance.rg, 0, 0)).xy;\n  vec2 target = project_position(vec4(a_Instance.ba, 0, 0)).xy;\n  float segmentIndex = a_Position.x;\n  float segmentRatio = getSegmentRatio(segmentIndex);\n  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));\n\n  float d_distance_ratio;\n   if(u_line_type == LineTypeDash) {\n    d_distance_ratio = segmentIndex / segmentNumber;\n    vec2 s = source;\n    vec2 t = target;\n    \n    if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n      s = unProjCustomCoord(source);\n      t = unProjCustomCoord(target);\n    }\n    float total_Distance = pixelDistance(s, t) / 2.0 * PI;\n    v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / (total_Distance / segmentNumber * segmentIndex);\n  }\n    if(u_animate.x == Animate) {\n      d_distance_ratio = segmentIndex / segmentNumber;\n  }\n  v_line_data.g = d_distance_ratio; // \u5F53\u524D\u70B9\u4F4D\u8DDD\u79BB\u5360\u7EBF\u603B\u957F\u7684\u6BD4\u4F8B\n\n  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);\n  vec3 curr = getPos(source, target, segmentRatio);\n  vec3 next = getPos(source, target, nextSegmentRatio);\n  vec2 offset = getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y);\n  // v_normal = getNormal((next.xy - curr.xy) * indexDir, a_Position.y);\n\n\n  v_segmentIndex = a_Position.x;\n  if(LineTexture == u_line_texture && u_line_type != LineTypeDash) { // \u5F00\u542F\u8D34\u56FE\u6A21\u5F0F  \n\n    float arcDistrance = length(source - target);\n    float pixelLen =  project_pixel_texture(u_icon_step);\n    v_line_data.b = floor(arcDistrance/pixelLen); // \u8D34\u56FE\u5728\u5F27\u7EBF\u4E0A\u91CD\u590D\u7684\u6570\u91CF\n\n    vec2 projectOffset = project_pixel(offset);\n    float lineOffsetWidth = length(projectOffset + projectOffset * sign(a_Position.y)); // \u7EBF\u6A2A\u5411\u504F\u79FB\u7684\u8DDD\u79BB\n    float linePixelSize = project_pixel(a_Size);  // \u5B9A\u70B9\u4F4D\u7F6E\u504F\u79FB\uFF0C\u6309\u5730\u56FE\u7B49\u7EA7\u7F29\u653E\u540E\u7684\u8DDD\u79BB\n    v_line_data.a = lineOffsetWidth/linePixelSize;  // \u7EBF\u56FE\u5C42\u8D34\u56FE\u90E8\u5206\u7684 v \u5750\u6807\u503C\n\n    v_iconMapUV = a_iconMapUV;\n  }\n\n\n  gl_Position = project_common_position_to_clipspace_v2(vec4(curr.xy + project_pixel(offset), curr.z * thetaOffset, 1.0));\n\n  // \u5730\u7403\u6A21\u5F0F\n  if(u_globel > 0.0) {\n    vec3 startLngLat = lglt2xyz(a_Instance.rg);\n    vec3 endLngLat = lglt2xyz(a_Instance.ba);\n    float globalRadius = length(startLngLat);\n\n    vec3 lineDir = normalize(endLngLat - startLngLat);\n    vec3 midPointDir = normalize((startLngLat + endLngLat)/2.0);\n\n    // \u7EBF\u7684\u504F\u79FB\n    vec3 lnglatOffset = cross(lineDir, midPointDir) * a_Position.y;\n    // \u8BA1\u7B97\u8D77\u59CB\u70B9\u548C\u7EC8\u6B62\u70B9\u7684\u8DDD\u79BB\n    float lnglatLength = length(a_Instance.rg - a_Instance.ba)/50.0;\n    // \u8BA1\u7B97\u98DE\u7EBF\u5404\u4E2A\u8282\u70B9\u76F8\u5E94\u7684\u9AD8\u5EA6\n    float lineHeight = u_global_height * (-4.0*segmentRatio*segmentRatio + 4.0 * segmentRatio) * lnglatLength;\n    // \u5730\u7403\u70B9\u4F4D\n    vec3 globalPoint = normalize(mix(startLngLat, endLngLat, segmentRatio)) * (globalRadius + lineHeight) + lnglatOffset * a_Size;\n    \n    gl_Position = u_ViewProjectionMatrix * vec4(globalPoint, 1.0);\n  }\n \n\n  setPickingColor(a_PickingColor);\n}\n"; // arc3d linear layer
-/* babel-plugin-inline-import '../shaders/linear/arc3d_linear_frag.glsl' */
-var arc3d_linear_frag = "\n#define Animate 0.0\nuniform float u_time;\nuniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\nvarying vec4 v_Color;\n\nvarying float v_distance_ratio;\n#pragma include \"picking\"\n\nvoid main() {\n\n  float animateSpeed = 0.0; // \u8FD0\u52A8\u901F\u5EA6\n  gl_FragColor = v_Color;\n\n  if(u_animate.x == Animate) {\n      animateSpeed = u_time / u_animate.y;\n      float alpha =1.0 - fract( mod(1.0- v_distance_ratio, u_animate.z)* (1.0/ u_animate.z) + u_time / u_animate.y);\n\n      alpha = (alpha + u_animate.w -1.0) / u_animate.w;\n      // alpha = smoothstep(0., 1., alpha);\n      alpha = clamp(alpha, 0.0, 1.0);\n      gl_FragColor.a *= alpha;\n\n      // u_animate \n      // x enable\n      // y duration\n      // z interval\n      // w trailLength\n  }\n\n  gl_FragColor = filterColor(gl_FragColor);\n}\n";
-/* babel-plugin-inline-import '../shaders/linear/arc3d_linear_vert.glsl' */
-var arc3d_linear_vert = "#define LineTypeSolid 0.0\n#define LineTypeDash 1.0\n#define Animate 0.0\n#define LineTexture 1.0\nattribute vec3 a_Position;\nattribute vec4 a_Instance;\nattribute vec4 a_Color;\nattribute float a_Size;\nattribute vec2 a_iconMapUV;\n\nuniform float u_globel;\nuniform float u_globel_radius;\nuniform float u_global_height: 10;\nuniform mat4 u_ModelMatrix;\n\nuniform float segmentNumber;\nuniform vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\nuniform vec4 u_sourceColor;\nuniform vec4 u_targetColor;\n\nuniform float u_line_type: 0.0;\nuniform vec4 u_dash_array: [10.0, 5., 0, 0];\nuniform float u_icon_step: 100;\nuniform float u_line_texture: 0.0;\nvarying float v_distance_ratio;\n\nvarying vec4 v_dash_array;\nvarying vec4 v_color;\nvarying vec2 v_iconMapUV;\nvarying vec4 v_Color;\n\n#pragma include \"projection\"\n#pragma include \"project\"\n#pragma include \"picking\"\n\nfloat maps (float value, float start1, float stop1, float start2, float stop2) {\n  return start2 + (stop2 - start2) * ((value - start1) / (stop1 - start1));\n}\n\nfloat getSegmentRatio(float index) {\n  return smoothstep(0.0, 1.0, index / (segmentNumber - 1.0));\n}\n\nfloat paraboloid(vec2 source, vec2 target, float ratio) {\n  vec2 x = mix(source, target, ratio);\n  vec2 center = mix(source, target, 0.5);\n  float dSourceCenter = distance(source, center);\n  float dXCenter = distance(x, center);\n  return (dSourceCenter + dXCenter) * (dSourceCenter - dXCenter);\n}\n\nvec3 getPos(vec2 source, vec2 target, float segmentRatio) {\n  float vertex_height = paraboloid(source, target, segmentRatio);\n\n  return vec3(\n    mix(source, target, segmentRatio),\n    sqrt(max(0.0, vertex_height))\n  );\n}\nvec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n  dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n\n  vec2 offset = dir_screenspace * offset_direction * setPickingSize(a_Size) / 2.0;\n\n  return offset;\n}\nvec2 getNormal(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n  dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n  return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);\n}\n\nfloat torad(float deg) {\n  return (deg / 180.0) * acos(-1.0);\n}\n\nvec3 lglt2xyz(vec2 lnglat) {\n  float pi = 3.1415926;\n  // + Math.PI/2 \u662F\u4E3A\u4E86\u5BF9\u9F50\u5750\u6807\n  float lng = torad(lnglat.x) + pi / 2.0;\n  float lat = torad(lnglat.y);\n\n  // \u624B\u52A8\u589E\u52A0\u4E00\u4E9B\u504F\u79FB\uFF0C\u51CF\u8F7B\u9762\u7684\u51B2\u7A81\n  float radius = u_globel_radius;\n\n  float z = radius * cos(lat) * cos(lng);\n  float x = radius * cos(lat) * sin(lng);\n  float y = radius * sin(lat);\n  return vec3(x, y, z);\n}\n\nvoid main() {\n  // cal style mapping - \u6570\u636E\u7EB9\u7406\u6620\u5C04\u90E8\u5206\u7684\u8BA1\u7B97\n\n  v_color = a_Color;\n  vec2 source = project_position(vec4(a_Instance.rg, 0, 0)).xy;\n  vec2 target = project_position(vec4(a_Instance.ba, 0, 0)).xy;\n  float segmentIndex = a_Position.x;\n  float segmentRatio = getSegmentRatio(segmentIndex);\n  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));\n\n  float d_distance_ratio;\n   if(u_line_type == LineTypeDash) {\n    d_distance_ratio = segmentIndex / segmentNumber;\n    // float total_Distance = pixelDistance(a_Instance.rg, a_Instance.ba) / 2.0 * PI;\n    vec2 s = source;\n    vec2 t = target;\n    \n    if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n      s = unProjCustomCoord(source);\n      t = unProjCustomCoord(target);\n    }\n    float total_Distance = pixelDistance(s, t) / 2.0 * PI;\n    v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / (total_Distance / segmentNumber * segmentIndex);\n  }\n    if(u_animate.x == Animate) {\n      v_distance_ratio = segmentIndex / segmentNumber;\n  }\n\n\n  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);\n  vec3 curr = getPos(source, target, segmentRatio);\n  vec3 next = getPos(source, target, nextSegmentRatio);\n  vec2 offset = getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y);\n\n  float animateSpeed = 0.0; // \u8FD0\u52A8\u901F\u5EA6\n  v_Color = mix(u_sourceColor, u_targetColor, a_Position.x/segmentNumber);\n\n  v_Color.a *= opacity;\n\n  gl_Position = project_common_position_to_clipspace_v2(vec4(curr.xy + project_pixel(offset), curr.z, 1.0));\n\n  // \u5730\u7403\u6A21\u5F0F\n  if(u_globel > 0.0) {\n    vec3 startLngLat = lglt2xyz(a_Instance.rg);\n    vec3 endLngLat = lglt2xyz(a_Instance.ba);\n    float globalRadius = length(startLngLat);\n\n    vec3 lineDir = normalize(endLngLat - startLngLat);\n    vec3 midPointDir = normalize((startLngLat + endLngLat)/2.0);\n\n    // \u7EBF\u7684\u504F\u79FB\n    vec3 lnglatOffset = cross(lineDir, midPointDir) * a_Position.y;\n    // \u8BA1\u7B97\u8D77\u59CB\u70B9\u548C\u7EC8\u6B62\u70B9\u7684\u8DDD\u79BB\n    float lnglatLength = length(a_Instance.rg - a_Instance.ba)/50.0;\n    // \u8BA1\u7B97\u98DE\u7EBF\u5404\u4E2A\u8282\u70B9\u76F8\u5E94\u7684\u9AD8\u5EA6\n    float lineHeight = u_global_height * (-4.0*segmentRatio*segmentRatio + 4.0 * segmentRatio) * lnglatLength;\n    // \u5730\u7403\u70B9\u4F4D\n    vec3 globalPoint = normalize(mix(startLngLat, endLngLat, segmentRatio)) * (globalRadius + lineHeight) + lnglatOffset * a_Size;\n    \n    gl_Position = u_ViewProjectionMatrix * vec4(globalPoint, 1.0);\n  }\n \n\n  setPickingColor(a_PickingColor);\n}\n";
+import { ShaderLocation } from "../../core/CommonStyleAttribute";
+/* babel-plugin-inline-import '../shaders/arc3d/line_arc_3d_frag.glsl' */
+var arc3d_line_frag = "#define LineTypeSolid 0.0\n#define LineTypeDash 1.0\n#define Animate 0.0\n#define LineTexture 1.0\n\nuniform sampler2D u_texture;\n\nlayout(std140) uniform commonUniorm {\n  vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\n  vec4 u_dash_array: [10.0, 5., 0, 0];\n  vec4 u_sourceColor;\n  vec4 u_targetColor;\n  vec2 u_textSize;\n  float u_globel;\n  float u_globel_radius;\n  float u_global_height: 10;\n  float segmentNumber;\n  float u_line_type: 0.0;\n  float u_icon_step: 100;\n  float u_line_texture: 0.0;\n  float u_textureBlend;\n  float u_time;\n  float u_linearColor: 0.0;\n};\n\n// varying vec2 v_normal;\nin vec4 v_dash_array;\nin vec4 v_color;\nin vec4 v_line_data;\nin float v_segmentIndex;\nin vec2 v_iconMapUV;\n\nout vec4 outputColor;\n\n#pragma include \"picking\"\n\nvoid main() {\n  float animateSpeed = 0.0; // \u8FD0\u52A8\u901F\u5EA6\n  float d_distance_ratio = v_line_data.g; // \u5F53\u524D\u70B9\u4F4D\u8DDD\u79BB\u5360\u7EBF\u603B\u957F\u7684\u6BD4\u4F8B\n  outputColor = v_color;\n\n  if(u_line_type == LineTypeDash) {\n    float flag = 0.;\n    float dashLength = mod(d_distance_ratio, v_dash_array.x + v_dash_array.y + v_dash_array.z + v_dash_array.w);\n    if(dashLength < v_dash_array.x || (dashLength > (v_dash_array.x + v_dash_array.y) && dashLength <  v_dash_array.x + v_dash_array.y + v_dash_array.z)) {\n      flag = 1.;\n    }\n    outputColor.a *=flag;\n  }\n\n  if(u_animate.x == Animate && u_line_texture != LineTexture) {\n      animateSpeed = u_time / u_animate.y;\n      float alpha =1.0 - fract( mod(1.0- d_distance_ratio, u_animate.z)* (1.0/ u_animate.z) + u_time / u_animate.y);\n\n      alpha = (alpha + u_animate.w -1.0) / u_animate.w;\n      // alpha = smoothstep(0., 1., alpha);\n      alpha = clamp(alpha, 0.0, 1.0);\n      outputColor.a *= alpha;\n\n      // u_animate \n      // x enable\n      // y duration\n      // z interval\n      // w trailLength\n  }\n\n  if(u_line_texture == LineTexture && u_line_type != LineTypeDash) { // while load texture\n    // float arcRadio = smoothstep( 0.0, 1.0, (v_segmentIndex / segmentNumber));\n    float arcRadio = v_segmentIndex / (segmentNumber - 1.0);\n    float count = v_line_data.b; // // \u8D34\u56FE\u5728\u5F27\u7EBF\u4E0A\u91CD\u590D\u7684\u6570\u91CF\n\n    float time = 0.0;\n    if(u_animate.x == Animate) {\n      time = u_time / u_animate.y;\n    }\n    float redioCount = arcRadio * count;\n\n    float u = fract(redioCount - time);\n\n    float v = v_line_data.a;  // \u7EBF\u56FE\u5C42\u8D34\u56FE\u90E8\u5206\u7684 v \u5750\u6807\u503C\n    vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.;\n    vec4 pattern = texture(SAMPLER_2D(u_texture), uv);\n\n    if(u_animate.x == Animate) {\n      float currentPlane = floor(redioCount - time);\n      float textureStep = floor(count * u_animate.z);\n      float a = mod(currentPlane, textureStep);\n      if(a < textureStep - 1.0) {\n        pattern = vec4(0.0);\n      }\n    }\n\n    if(u_textureBlend == 0.0) { // normal\n      pattern.a = 0.0;\n      outputColor = filterColor(outputColor + pattern);\n    } else { // replace\n        pattern.a *= v_color.a;\n        if(outputColor.a <= 0.0) {\n          pattern.a = 0.0;\n          discard;\n        } else {\n          outputColor = filterColor(pattern);\n        }\n    }\n\n  } else {\n    outputColor = filterColor(outputColor);\n  }\n}\n";
+/* babel-plugin-inline-import '../shaders/arc3d/line_arc_3d_vert.glsl' */
+var arc3d_line_vert = "#define LineTypeSolid 0.0\n#define LineTypeDash 1.0\n#define Animate 0.0\n#define LineTexture 1.0\nlayout(location = 0) in vec3 a_Position;\nlayout(location = 1) in vec4 a_Color;\nlayout(location = 9) in float a_Size;\nlayout(location = 12) in vec4 a_Instance;\nlayout(location = 14) in vec2 a_iconMapUV;\n\n\nlayout(std140) uniform commonUniorm {\n  vec4 u_animate: [ 1., 2., 1.0, 0.2 ];\n  vec4 u_dash_array: [10.0, 5., 0, 0];\n  vec4 u_sourceColor;\n  vec4 u_targetColor;\n  vec2 u_textSize;\n  float u_globel;\n  float u_globel_radius;\n  float u_global_height: 10;\n  float segmentNumber;\n  float u_line_type: 0.0;\n  float u_icon_step: 100;\n  float u_line_texture: 0.0;\n  float u_textureBlend;\n  float u_time;\n  float u_linearColor: 0.0;\n};\nout vec4 v_color;\nout vec4 v_dash_array;\nout float v_segmentIndex;\nout vec2 v_iconMapUV;\nout vec4 v_line_data;\n\n#pragma include \"projection\"\n#pragma include \"project\"\n#pragma include \"picking\"\n\nfloat maps (float value, float start1, float stop1, float start2, float stop2) {\n  return start2 + (stop2 - start2) * ((value - start1) / (stop1 - start1));\n}\n\nfloat getSegmentRatio(float index) {\n  return smoothstep(0.0, 1.0, index / (segmentNumber - 1.0));\n}\n\nfloat paraboloid(vec2 source, vec2 target, float ratio) {\n  vec2 x = mix(source, target, ratio);\n  vec2 center = mix(source, target, 0.5);\n  float dSourceCenter = distance(source, center);\n  float dXCenter = distance(x, center);\n  return (dSourceCenter + dXCenter) * (dSourceCenter - dXCenter);\n}\n\nvec3 getPos(vec2 source, vec2 target, float segmentRatio) {\n  float vertex_height = paraboloid(source, target, segmentRatio);\n\n  return vec3(\n    mix(source, target, segmentRatio),\n    sqrt(max(0.0, vertex_height))\n  );\n}\nvec2 getExtrusionOffset(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n  dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n\n  vec2 offset = dir_screenspace * offset_direction * setPickingSize(a_Size) / 2.0;\n\n  return offset;\n}\nvec2 getNormal(vec2 line_clipspace, float offset_direction) {\n  // normalized direction of the line\n  vec2 dir_screenspace = normalize(line_clipspace);\n  // rotate by 90 degrees\n  dir_screenspace = vec2(-dir_screenspace.y, dir_screenspace.x);\n  return reverse_offset_normal(vec3(dir_screenspace,1.0)).xy * sign(offset_direction);\n}\n\nfloat torad(float deg) {\n  return (deg / 180.0) * acos(-1.0);\n}\n\nvec3 lglt2xyz(vec2 lnglat) {\n  float pi = 3.1415926;\n  // + Math.PI/2 \u662F\u4E3A\u4E86\u5BF9\u9F50\u5750\u6807\n  float lng = torad(lnglat.x) + pi / 2.0;\n  float lat = torad(lnglat.y);\n\n  // \u624B\u52A8\u589E\u52A0\u4E00\u4E9B\u504F\u79FB\uFF0C\u51CF\u8F7B\u9762\u7684\u51B2\u7A81\n  float radius = u_globel_radius;\n\n  float z = radius * cos(lat) * cos(lng);\n  float x = radius * cos(lat) * sin(lng);\n  float y = radius * sin(lat);\n  return vec3(x, y, z);\n}\n\nvoid main() {\n  //vs\u4E2D\u8BA1\u7B97\u6E10\u53D8\u8272\n  if(u_linearColor==1.0){\n    float d_segmentIndex = a_Position.x + 1.0; // \u5F53\u524D\u9876\u70B9\u5728\u5F27\u7EBF\u4E2D\u6240\u5904\u7684\u5206\u6BB5\u4F4D\u7F6E\n    v_color = mix(u_sourceColor, u_targetColor, d_segmentIndex/segmentNumber);\n  }\n  else{\n    v_color = a_Color;\n  }\n  v_color.a = v_color.a * opacity;\n  vec2 source = project_position(vec4(a_Instance.rg, 0, 0)).xy;\n  vec2 target = project_position(vec4(a_Instance.ba, 0, 0)).xy;\n  float segmentIndex = a_Position.x;\n  float segmentRatio = getSegmentRatio(segmentIndex);\n  float indexDir = mix(-1.0, 1.0, step(segmentIndex, 0.0));\n\n  float d_distance_ratio;\n   if(u_line_type == LineTypeDash) {\n    d_distance_ratio = segmentIndex / segmentNumber;\n    vec2 s = source;\n    vec2 t = target;\n    \n    if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) { // gaode2.x\n      s = unProjCustomCoord(source);\n      t = unProjCustomCoord(target);\n    }\n    float total_Distance = pixelDistance(s, t) / 2.0 * PI;\n    v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / (total_Distance / segmentNumber * segmentIndex);\n  }\n    if(u_animate.x == Animate) {\n      d_distance_ratio = segmentIndex / segmentNumber;\n  }\n  v_line_data.g = d_distance_ratio; // \u5F53\u524D\u70B9\u4F4D\u8DDD\u79BB\u5360\u7EBF\u603B\u957F\u7684\u6BD4\u4F8B\n\n  float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir);\n  vec3 curr = getPos(source, target, segmentRatio);\n  vec3 next = getPos(source, target, nextSegmentRatio);\n  vec2 offset = getExtrusionOffset((next.xy - curr.xy) * indexDir, a_Position.y);\n  // v_normal = getNormal((next.xy - curr.xy) * indexDir, a_Position.y);\n\n\n  v_segmentIndex = a_Position.x;\n  if(LineTexture == u_line_texture && u_line_type != LineTypeDash) { // \u5F00\u542F\u8D34\u56FE\u6A21\u5F0F  \n\n    float arcDistrance = length(source - target);\n    float pixelLen =  project_pixel_texture(u_icon_step);\n    v_line_data.b = floor(arcDistrance/pixelLen); // \u8D34\u56FE\u5728\u5F27\u7EBF\u4E0A\u91CD\u590D\u7684\u6570\u91CF\n\n    vec2 projectOffset = project_pixel(offset);\n    float lineOffsetWidth = length(projectOffset + projectOffset * sign(a_Position.y)); // \u7EBF\u6A2A\u5411\u504F\u79FB\u7684\u8DDD\u79BB\n    float linePixelSize = project_pixel(a_Size);  // \u5B9A\u70B9\u4F4D\u7F6E\u504F\u79FB\uFF0C\u6309\u5730\u56FE\u7B49\u7EA7\u7F29\u653E\u540E\u7684\u8DDD\u79BB\n    v_line_data.a = lineOffsetWidth/linePixelSize;  // \u7EBF\u56FE\u5C42\u8D34\u56FE\u90E8\u5206\u7684 v \u5750\u6807\u503C\n\n    v_iconMapUV = a_iconMapUV;\n  }\n\n\n  gl_Position = project_common_position_to_clipspace_v2(vec4(curr.xy + project_pixel(offset), curr.z * thetaOffset, 1.0));\n\n  // \u5730\u7403\u6A21\u5F0F\n  if(u_globel > 0.0) {\n    vec3 startLngLat = lglt2xyz(a_Instance.rg);\n    vec3 endLngLat = lglt2xyz(a_Instance.ba);\n    float globalRadius = length(startLngLat);\n\n    vec3 lineDir = normalize(endLngLat - startLngLat);\n    vec3 midPointDir = normalize((startLngLat + endLngLat)/2.0);\n\n    // \u7EBF\u7684\u504F\u79FB\n    vec3 lnglatOffset = cross(lineDir, midPointDir) * a_Position.y;\n    // \u8BA1\u7B97\u8D77\u59CB\u70B9\u548C\u7EC8\u6B62\u70B9\u7684\u8DDD\u79BB\n    float lnglatLength = length(a_Instance.rg - a_Instance.ba)/50.0;\n    // \u8BA1\u7B97\u98DE\u7EBF\u5404\u4E2A\u8282\u70B9\u76F8\u5E94\u7684\u9AD8\u5EA6\n    float lineHeight = u_global_height * (-4.0*segmentRatio*segmentRatio + 4.0 * segmentRatio) * lnglatLength;\n    // \u5730\u7403\u70B9\u4F4D\n    vec3 globalPoint = normalize(mix(startLngLat, endLngLat, segmentRatio)) * (globalRadius + lineHeight) + lnglatOffset * a_Size;\n    \n    gl_Position = u_ViewProjectionMatrix * vec4(globalPoint, 1.0);\n  }\n \n\n  setPickingColor(a_PickingColor);\n}\n";
 var lineStyleObj = {
   solid: 0.0,
   dash: 1.0
@@ -55,14 +51,15 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
         width: 1024,
         height: _this.iconService.canvasHeight || 128
       });
+      _this.textures = [_this.texture];
     });
     return _this;
   }
   _createClass(Arc3DModel, [{
-    key: "getUninforms",
+    key: "getCommonUniformsInfo",
     value:
     // public enableShaderEncodeStyles = ['opacity'];
-    function getUninforms() {
+    function getCommonUniformsInfo() {
       var _ref = this.layer.getLayerConfig(),
         sourceColor = _ref.sourceColor,
         targetColor = _ref.targetColor,
@@ -80,10 +77,11 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
         segmentNumber = _ref$segmentNumber === void 0 ? 30 : _ref$segmentNumber,
         _ref$globalArcHeight = _ref.globalArcHeight,
         globalArcHeight = _ref$globalArcHeight === void 0 ? 10 : _ref$globalArcHeight;
+      var _ref2 = this.layer.getLayerConfig(),
+        animateOption = _ref2.animateOption;
       if (dashArray.length === 2) {
         dashArray.push(0, 0);
       }
-
       // 转化渐变色
       var useLinearColor = 0; // 默认不生效
       var sourceColorArr = [0, 0, 0, 0];
@@ -96,38 +94,37 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
       if (this.rendererService.getDirty()) {
         this.texture.bind();
       }
-      return _objectSpread({
+      var commonOptions = {
+        u_animate: this.animateOption2Array(animateOption),
+        u_dash_array: dashArray,
+        u_sourceColor: sourceColorArr,
+        u_targetColor: targetColorArr,
+        u_textSize: [1024, this.iconService.canvasHeight || 128],
         u_globel: this.mapService.version === 'GLOBEL' ? 1 : 0,
         u_globel_radius: EARTH_RADIUS,
         // 地球半径
         u_global_height: globalArcHeight,
-        u_textureBlend: textureBlend === 'normal' ? 0.0 : 1.0,
         segmentNumber: segmentNumber,
         u_line_type: lineStyleObj[lineType] || 0.0,
-        u_dash_array: dashArray,
-        // 纹理支持参数
-        u_texture: this.texture,
-        // 贴图
+        u_icon_step: iconStep,
         u_line_texture: lineTexture ? 1.0 : 0.0,
         // 传入线的标识
-        u_icon_step: iconStep,
-        u_textSize: [1024, this.iconService.canvasHeight || 128],
-        // 渐变色支持参数
-        u_linearColor: useLinearColor,
-        u_sourceColor: sourceColorArr,
-        u_targetColor: targetColorArr
-      }, this.getStyleAttribute());
-    }
-  }, {
-    key: "getAnimateUniforms",
-    value: function getAnimateUniforms() {
-      var _ref2 = this.layer.getLayerConfig(),
-        animateOption = _ref2.animateOption;
-      return {
-        u_animate: this.animateOption2Array(animateOption),
-        u_time: this.layer.getLayerAnimateTime()
+        u_textureBlend: textureBlend === 'normal' ? 0.0 : 1.0,
+        u_time: this.layer.getLayerAnimateTime() || 0,
+        u_linearColor: useLinearColor //是否使用渐变色
       };
+
+      var commonBufferInfo = this.getUniformsBufferInfo(commonOptions);
+      return commonBufferInfo;
     }
+
+    // public getAnimateUniforms(): IModelUniform {
+    //   const { animateOption } = this.layer.getLayerConfig() as ILayerConfig;
+    //   return {
+    //     u_animate: this.animateOption2Array(animateOption as IAnimateOption),
+    //     u_time: this.layer.getLayerAnimateTime(),
+    //   };
+    // }
   }, {
     key: "initModels",
     value: function () {
@@ -135,10 +132,11 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
         return _regeneratorRuntime.wrap(function _callee$(_context) {
           while (1) switch (_context.prev = _context.next) {
             case 0:
+              this.initUniformsBuffer();
               this.updateTexture();
               this.iconService.on('imageUpdate', this.updateTexture);
               return _context.abrupt("return", this.buildModels());
-            case 3:
+            case 4:
             case "end":
               return _context.stop();
           }
@@ -159,33 +157,21 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
   }, {
     key: "getShaders",
     value: function getShaders() {
-      var _ref3 = this.layer.getLayerConfig(),
-        sourceColor = _ref3.sourceColor,
-        targetColor = _ref3.targetColor;
-      if (sourceColor && targetColor) {
-        // 分离 linear 功能
-        return {
-          frag: arc3d_linear_frag,
-          vert: arc3d_linear_vert,
-          type: 'Linear'
-        };
-      } else {
-        return {
-          frag: arc3d_line_frag,
-          vert: arc3d_line_vert,
-          type: ''
-        };
-      }
+      return {
+        frag: arc3d_line_frag,
+        vert: arc3d_line_vert,
+        type: ''
+      };
     }
   }, {
     key: "buildModels",
     value: function () {
       var _buildModels = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
-        var _ref4, _ref4$segmentNumber, segmentNumber, _this$getShaders, frag, vert, type, model;
+        var _ref3, _ref3$segmentNumber, segmentNumber, _this$getShaders, frag, vert, type, model;
         return _regeneratorRuntime.wrap(function _callee2$(_context2) {
           while (1) switch (_context2.prev = _context2.next) {
             case 0:
-              _ref4 = this.layer.getLayerConfig(), _ref4$segmentNumber = _ref4.segmentNumber, segmentNumber = _ref4$segmentNumber === void 0 ? 30 : _ref4$segmentNumber;
+              _ref3 = this.layer.getLayerConfig(), _ref3$segmentNumber = _ref3.segmentNumber, segmentNumber = _ref3$segmentNumber === void 0 ? 30 : _ref3$segmentNumber;
               _this$getShaders = this.getShaders(), frag = _this$getShaders.frag, vert = _this$getShaders.vert, type = _this$getShaders.type;
               _context2.next = 4;
               return this.layer.buildLayerModel({
@@ -221,6 +207,7 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
         type: AttributeType.Attribute,
         descriptor: {
           name: 'a_Size',
+          shaderLocation: ShaderLocation.SIZE,
           buffer: {
             // give the WebGL driver a hint that this buffer may change
             usage: gl.DYNAMIC_DRAW,
@@ -241,6 +228,7 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
         type: AttributeType.Attribute,
         descriptor: {
           name: 'a_Instance',
+          shaderLocation: 12,
           buffer: {
             usage: gl.STATIC_DRAW,
             data: [],
@@ -257,6 +245,7 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
         type: AttributeType.Attribute,
         descriptor: {
           name: 'a_iconMapUV',
+          shaderLocation: 14,
           buffer: {
             usage: gl.DYNAMIC_DRAW,
             data: [],
@@ -266,12 +255,12 @@ var Arc3DModel = /*#__PURE__*/function (_BaseModel) {
           update: function update(feature) {
             var iconMap = _this2.iconService.getIconMap();
             var texture = feature.texture;
-            var _ref5 = iconMap[texture] || {
+            var _ref4 = iconMap[texture] || {
                 x: 0,
                 y: 0
               },
-              x = _ref5.x,
-              y = _ref5.y;
+              x = _ref4.x,
+              y = _ref4.y;
             return [x, y];
           }
         }

package/es/line/models/flow.d.ts

@@ -1,7 +1,13 @@
-import { IModel, IModelUniform } from '@antv/l7-core';
+import type { IModel } from '@antv/l7-core';
 import BaseModel from '../../core/BaseModel';
 export default class FlowLineModel extends BaseModel {
-    getUninforms(): IModelUniform;
+    protected getCommonUniformsInfo(): {
+        uniformsArray: number[];
+        uniformsLength: number;
+        uniformsOption: {
+            [key: string]: any;
+        };
+    };
     initModels(): Promise<IModel[]>;
     buildModels(): Promise<IModel[]>;
     protected registerBuiltinAttributes(): void;