diff --git a/packages/layers/src/line/shaders/line_arc_3d_frag.glsl b/packages/layers/src/line/shaders/line_arc_3d_frag.glsl index e4df635985..2006c1da27 100644 --- a/packages/layers/src/line/shaders/line_arc_3d_frag.glsl +++ b/packages/layers/src/line/shaders/line_arc_3d_frag.glsl @@ -17,8 +17,6 @@ uniform vec2 u_textSize; varying float v_segmentIndex; uniform float segmentNumber; -varying vec4 v_dataset; // 数据集 - varying vec2 v_iconMapUV; uniform float u_time; @@ -35,7 +33,7 @@ varying mat4 styleMappingMat; void main() { float opacity = styleMappingMat[0][0]; float animateSpeed = 0.0; // 运动速度 - float d_distance_ratio = v_dataset.g; // 当前点位距离占线总长的比例 + float d_distance_ratio = styleMappingMat[3].g; // 当前点位距离占线总长的比例 if(u_linearColor == 1.0) { // 使用渐变颜色 gl_FragColor = mix(u_sourceColor, u_targetColor, v_segmentIndex/segmentNumber); @@ -68,7 +66,7 @@ void main() { if(u_line_texture == LineTexture && u_line_type != LineTypeDash) { // while load texture // float arcRadio = smoothstep( 0.0, 1.0, (v_segmentIndex / segmentNumber)); float arcRadio = v_segmentIndex / (segmentNumber - 1.0); - float count = v_dataset.b; // // 贴图在弧线上重复的数量 + float count = styleMappingMat[3].b; // // 贴图在弧线上重复的数量 float u = fract(arcRadio * count - animateSpeed * count); @@ -76,7 +74,7 @@ void main() { u = gl_FragColor.a/opacity; } - float v = v_dataset.a; // 线图层贴图部分的 v 坐标值 + float v = styleMappingMat[3].a; // 线图层贴图部分的 v 坐标值 vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.; vec4 pattern = texture2D(u_texture, uv); diff --git a/packages/layers/src/line/shaders/line_arc_3d_vert.glsl b/packages/layers/src/line/shaders/line_arc_3d_vert.glsl index 3cb3685e98..697221985f 100644 --- a/packages/layers/src/line/shaders/line_arc_3d_vert.glsl +++ b/packages/layers/src/line/shaders/line_arc_3d_vert.glsl @@ -24,8 +24,6 @@ uniform float u_icon_step: 100; uniform float u_line_texture: 0.0; varying float v_segmentIndex; -varying vec4 v_dataset; // 数据集 - attribute vec2 a_iconMapUV; varying vec2 v_iconMapUV; @@ -106,7 +104,7 @@ void main() { 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 + 0.0, 0.0, 0.0, 0.0 // dataset 数据集 ); float rowCount = u_cellTypeLayout[0][0]; // 当前的数据纹理有几行 @@ -151,7 +149,7 @@ void main() { if(u_aimate.x == Animate) { d_distance_ratio = segmentIndex / segmentNumber; } - v_dataset.g = d_distance_ratio; // 当前点位距离占线总长的比例 + styleMappingMat[3].g = d_distance_ratio; // 当前点位距离占线总长的比例 float nextSegmentRatio = getSegmentRatio(segmentIndex + indexDir); vec3 curr = getPos(source, target, segmentRatio); @@ -165,12 +163,12 @@ void main() { float arcDistrance = length(source - target); float pixelLen = project_pixel(u_icon_step); - v_dataset.b = floor(arcDistrance/pixelLen); // 贴图在弧线上重复的数量 + styleMappingMat[3].b = floor(arcDistrance/pixelLen); // 贴图在弧线上重复的数量 vec2 projectOffset = project_pixel(offset); float lineOffsetWidth = length(projectOffset + projectOffset * sign(a_Position.y)); // 线横向偏移的距离 float linePixelSize = project_pixel(a_Size); // 定点位置偏移，按地图等级缩放后的距离 - v_dataset.a = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值 + styleMappingMat[3].a = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值 v_iconMapUV = a_iconMapUV; } diff --git a/packages/layers/src/line/shaders/line_arc_frag.glsl b/packages/layers/src/line/shaders/line_arc_frag.glsl index 9077a56550..ec3bed1add 100644 --- a/packages/layers/src/line/shaders/line_arc_frag.glsl +++ b/packages/layers/src/line/shaders/line_arc_frag.glsl @@ -21,8 +21,6 @@ uniform vec2 u_textSize; uniform float segmentNumber; varying vec2 v_iconMapUV; -varying vec4 v_dataset; // 数据集 - 用于合并单个的 varying 变量 - varying mat4 styleMappingMat; // 传递从片元中传递的映射数据 uniform float u_linearColor: 0; @@ -34,8 +32,8 @@ uniform vec4 u_targetColor; void main() { float opacity = styleMappingMat[0][0]; float animateSpeed = 0.0; // 运动速度 - float d_segmentIndex = v_dataset.r; // 当前顶点在弧线中所处的分段位置 - float d_distance_ratio = v_dataset.b; // 当前顶点在弧线中所处的分段比例 + float d_segmentIndex = styleMappingMat[3].r; // 当前顶点在弧线中所处的分段位置 + float d_distance_ratio = styleMappingMat[3].b; // 当前顶点在弧线中所处的分段比例 // 设置弧线的底色 if(u_linearColor == 1.0) { // 使用渐变颜色 @@ -70,14 +68,14 @@ void main() { float arcRadio = smoothstep( 0.0, 1.0, (d_segmentIndex / segmentNumber)); // float arcRadio = smoothstep( 0.0, 1.0, d_distance_ratio); - float d_texCount = v_dataset.g; // 贴图在弧线上重复的数量 + float d_texCount = styleMappingMat[3].g; // 贴图在弧线上重复的数量 float u = 1.0 - fract(arcRadio * d_texCount + animateSpeed); if(u_aimate.x == Animate) { u = gl_FragColor.a/opacity; } - float v = v_dataset.a; // 横向 v + float v = styleMappingMat[3].a; // 横向 v vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.; vec4 pattern = texture2D(u_texture, uv); diff --git a/packages/layers/src/line/shaders/line_arc_great_circle_frag.glsl b/packages/layers/src/line/shaders/line_arc_great_circle_frag.glsl index 1d373a4c11..952c7d431d 100644 --- a/packages/layers/src/line/shaders/line_arc_great_circle_frag.glsl +++ b/packages/layers/src/line/shaders/line_arc_great_circle_frag.glsl @@ -20,8 +20,6 @@ uniform sampler2D u_texture; uniform vec2 u_textSize; uniform float segmentNumber; -varying vec4 v_dataset; // 数据集 - varying vec2 v_iconMapUV; uniform float u_linearColor: 0; @@ -37,7 +35,7 @@ varying mat4 styleMappingMat; void main() { float opacity = styleMappingMat[0][0]; float animateSpeed = 0.0; - float d_segmentIndex = v_dataset.g; + float d_segmentIndex = styleMappingMat[3].g; // 设置弧线的底色 if(u_linearColor == 1.0) { // 使用渐变颜色 @@ -71,14 +69,14 @@ void main() { if(LineTexture == u_line_texture && u_line_type != LineTypeDash) { float arcRadio = smoothstep( 0.0, 1.0, (d_segmentIndex / (segmentNumber - 1.0))); // float arcRadio = d_segmentIndex / (segmentNumber - 1.0); - float count = v_dataset.b; // 贴图在弧线上重复的数量 + float count = styleMappingMat[3].b; // 贴图在弧线上重复的数量 float u = fract(arcRadio * count - animateSpeed * count); // float u = fract(arcRadio * count - animateSpeed); if(u_aimate.x == Animate) { u = gl_FragColor.a/opacity; } - float v = v_dataset.a; // 线图层贴图部分的 v 坐标值 + float v = styleMappingMat[3].a; // 线图层贴图部分的 v 坐标值 vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.; vec4 pattern = texture2D(u_texture, uv); diff --git a/packages/layers/src/line/shaders/line_arc_great_circle_vert.glsl b/packages/layers/src/line/shaders/line_arc_great_circle_vert.glsl index 1709fa4b79..1a3de78de4 100644 --- a/packages/layers/src/line/shaders/line_arc_great_circle_vert.glsl +++ b/packages/layers/src/line/shaders/line_arc_great_circle_vert.glsl @@ -22,8 +22,6 @@ varying vec4 v_dash_array; uniform float u_icon_step: 100; uniform float u_line_texture: 0.0; -varying vec4 v_dataset; // 数据集 - attribute vec2 a_iconMapUV; varying vec2 v_iconMapUV; @@ -131,7 +129,7 @@ void main() { 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 + 0.0, 0.0, 0.0, 0.0 // dataset 数据集 ); float rowCount = u_cellTypeLayout[0][0]; // 当前的数据纹理有几行 @@ -185,7 +183,7 @@ void main() { // vec4 project_pos = project_position(vec4(curr.xy, 0, 1.0)); // gl_Position = project_common_position_to_clipspace(vec4(curr.xy + offset, curr.z, 1.0)); - v_dataset.g = a_Position.x; // 该顶点在弧线上的分段排序 + styleMappingMat[3].g = a_Position.x; // 该顶点在弧线上的分段排序 if(LineTexture == u_line_texture) { // 开启贴图模式 // float mapZoomScale = u_CoordinateSystem !== COORDINATE_SYSTEM_P20_2?10000000.0:1.0; float d_arcDistrance = length(source - target); @@ -196,11 +194,11 @@ void main() { d_arcDistrance = project_pixel_allmap(d_arcDistrance); } float d_pixelLen = project_pixel(u_icon_step)/8.0; - v_dataset.b = floor(d_arcDistrance/d_pixelLen); // 贴图在弧线上重复的数量 + styleMappingMat[3].b = floor(d_arcDistrance/d_pixelLen); // 贴图在弧线上重复的数量 float lineOffsetWidth = length(offset + offset * sign(a_Position.y)); // 线横向偏移的距离 float linePixelSize = project_pixel(a_Size); // 定点位置偏移，按地图等级缩放后的距离 - v_dataset.a = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值 + styleMappingMat[3].a = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值 v_iconMapUV = a_iconMapUV; } diff --git a/packages/layers/src/line/shaders/line_arc_vert.glsl b/packages/layers/src/line/shaders/line_arc_vert.glsl index 40ed5dac00..6e5c4328fe 100644 --- a/packages/layers/src/line/shaders/line_arc_vert.glsl +++ b/packages/layers/src/line/shaders/line_arc_vert.glsl @@ -25,8 +25,6 @@ uniform float u_line_texture: 0.0; attribute vec2 a_iconMapUV; varying vec2 v_iconMapUV; -varying vec4 v_dataset; // 数据集 - 用于合并单个的 varying 变量 - uniform float u_opacity: 1.0; varying mat4 styleMappingMat; // 用于将在顶点着色器中计算好的样式值传递给片元 @@ -92,7 +90,7 @@ void main() { 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 + 0.0, 0.0, 0.0, 0.0 // dataset 数据集 ); float rowCount = u_cellTypeLayout[0][0]; // 当前的数据纹理有几行 @@ -144,7 +142,7 @@ void main() { } } - v_dataset.b = d_distance_ratio; + styleMappingMat[3].b = d_distance_ratio; vec4 curr = project_position(vec4(interpolate(source, target, segmentRatio), 0.0, 1.0)); vec4 next = project_position(vec4(interpolate(source, target, nextSegmentRatio), 0.0, 1.0)); @@ -155,7 +153,7 @@ void main() { float d_segmentIndex = a_Position.x + 1.0; // 当前顶点在弧线中所处的分段位置 - v_dataset.r = d_segmentIndex; + styleMappingMat[3].r = d_segmentIndex; if(LineTexture == u_line_texture) { // 开启贴图模式 @@ -171,11 +169,11 @@ void main() { float pixelLen = project_pixel(u_icon_step); // 贴图沿弧线方向的长度 - 随地图缩放改变 float texCount = floor(arcDistrance/pixelLen); // 贴图在弧线上重复的数量 - v_dataset.g = texCount; + styleMappingMat[3].g = texCount; float lineOffsetWidth = length(offset + offset * sign(a_Position.y)); // 线横向偏移的距离 float linePixelSize = project_pixel(a_Size); // 定点位置偏移 - v_dataset.a = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值 + styleMappingMat[3].a = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值 } diff --git a/packages/layers/src/line/shaders/line_frag.glsl b/packages/layers/src/line/shaders/line_frag.glsl index 8fb9721b1f..df462e9415 100644 --- a/packages/layers/src/line/shaders/line_frag.glsl +++ b/packages/layers/src/line/shaders/line_frag.glsl @@ -7,7 +7,7 @@ uniform float u_line_type: 0.0; uniform float u_opacity : 1.0; uniform float u_textureBlend; varying vec4 v_color; -varying vec2 v_normal; +// varying vec2 v_normal; // line texture uniform float u_line_texture; @@ -19,8 +19,6 @@ uniform float u_dash_offset : 0.0; uniform float u_dash_ratio : 0.1; varying vec4 v_dash_array; -varying vec4 v_dataset; // 数据集 - distance_ratio/distance/pixelLen/texV - varying vec2 v_iconMapUV; uniform float u_linearColor: 0; @@ -37,7 +35,7 @@ varying mat4 styleMappingMat; void main() { float opacity = styleMappingMat[0][0]; float animateSpeed = 0.0; // 运动速度 - float d_distance_ratio = v_dataset.r; // 当前点位距离占线总长的比例 + float d_distance_ratio = styleMappingMat[3].r; // 当前点位距离占线总长的比例 if(u_linearColor == 1.0) { // 使用渐变颜色 gl_FragColor = mix(u_sourceColor, u_targetColor, d_distance_ratio); @@ -66,13 +64,14 @@ void main() { } if(u_line_texture == LineTexture && u_line_type != LineTypeDash) { // while load texture - float aDistance = v_dataset.g; // 当前顶点的距离 - float d_texPixelLen = v_dataset.b; // 贴图的像素长度，根据地图层级缩放 + float aDistance = styleMappingMat[3].g; // 当前顶点的距离 + float d_texPixelLen = styleMappingMat[3].b; // 贴图的像素长度，根据地图层级缩放 float u = fract(mod(aDistance, d_texPixelLen)/d_texPixelLen - animateSpeed); - float v = v_dataset.a; // 线图层贴图部分的 v 坐标值 + float v = styleMappingMat[3].a; // 线图层贴图部分的 v 坐标值 v = max(smoothstep(0.95, 1.0, v), v); vec2 uv= v_iconMapUV / u_textSize + vec2(u, v) / u_textSize * 64.; + // gl_FragColor = filterColor(gl_FragColor + texture2D(u_texture, vec2(u, v))); // gl_FragColor = filterColor(gl_FragColor + texture2D(u_texture, uv)); vec4 pattern = texture2D(u_texture, uv); @@ -90,13 +89,14 @@ void main() { } else { gl_FragColor = filterColor(gl_FragColor); } - // gl_FragColor = filterColor(vec4(1.0, 0.0, 0.0, 1.0)); + + // gl_FragColor = (vec4(1.0, 0.0, 0.0, 1.0)); // if(rV < r || rV > 1.0 - r) { // gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0); // } // if(v > 0.9) { - // gl_FragColor = vec4(0.17647, 0.43921568, 0.2, 1.0); + // gl_FragColor = vec4(0.17647, 0.43921568, 0.2, 1.0); // } else if(v < 0.1) { // gl_FragColor = vec4(0.17647, 0.43921568, 0.2, 1.0); // } diff --git a/packages/layers/src/line/shaders/line_vert.glsl b/packages/layers/src/line/shaders/line_vert.glsl index 1dc6685177..3dbb98ba91 100644 --- a/packages/layers/src/line/shaders/line_vert.glsl +++ b/packages/layers/src/line/shaders/line_vert.glsl @@ -28,9 +28,10 @@ varying vec4 v_color; varying vec4 v_dash_array; varying vec2 v_normal; -varying vec4 v_dataset; // 数据集 - distance_ratio/distance/pixelLen/texV // texV 线图层 - 贴图部分的 v 坐标（线的宽度方向） varying vec2 v_iconMapUV; + + uniform float u_linearColor: 0; uniform float u_opacity: 1.0; @@ -45,7 +46,7 @@ void main() { 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 + 0.0, 0.0, 0.0, 0.0 // distance_ratio/distance/pixelLen/texV ); float rowCount = u_cellTypeLayout[0][0]; // 当前的数据纹理有几行 @@ -84,7 +85,6 @@ void main() { } v_normal = vec2(reverse_offset_normal(a_Normal) * sign(a_Miter)); - v_color = a_Color; vec3 size = a_Miter * setPickingSize(a_Size.x) * reverse_offset_normal(a_Normal); @@ -96,10 +96,10 @@ void main() { float texV = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值 // 设置数据集的参数 - v_dataset.r = d_distance_ratio; // 当前点位距离占线总长的比例 - v_dataset.g = a_Distance; // 当前顶点的距离 - v_dataset.b = d_texPixelLen; // 贴图的像素长度，根据地图层级缩放 - v_dataset.a = texV; // 线图层贴图部分的 v 坐标值 + styleMappingMat[3][0] = d_distance_ratio; // 当前点位距离占线总长的比例 + styleMappingMat[3][1] = a_Distance; // 当前顶点的距离 + styleMappingMat[3][2] = d_texPixelLen; // 贴图的像素长度，根据地图层级缩放 + styleMappingMat[3][3] = texV; // 线图层贴图部分的 v 坐标值 vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));