mirror of https://gitee.com/antv-l7/antv-l7
Merge branch 'master' of https://github.com/antvis/L7
This commit is contained in:
2912401452
commit
2545a7aac7
|
|
@ -17,14 +17,11 @@ uniform vec2 u_textSize;
|
|||
// dash
|
||||
uniform float u_dash_offset : 0.0;
|
||||
uniform float u_dash_ratio : 0.1;
|
||||
varying float v_distance_ratio;
|
||||
varying vec4 v_dash_array;
|
||||
varying float v_side;
|
||||
|
||||
varying float v_distance;
|
||||
varying vec2 v_offset;
|
||||
varying float v_a;
|
||||
varying float v_pixelLen;
|
||||
varying float v_v;
|
||||
varying vec4 v_dataset; // 数据集 - distance_ratio/distance/pixelLen/texV
|
||||
|
||||
varying vec2 v_iconMapUV;
|
||||
|
||||
uniform float u_linearColor: 0;
|
||||
|
|
@ -41,11 +38,10 @@ varying mat4 styleMappingMat;
|
|||
void main() {
|
||||
float opacity = styleMappingMat[0][0];
|
||||
float animateSpeed = 0.0; // 运动速度
|
||||
|
||||
// gl_FragColor = v_color;
|
||||
float d_distance_ratio = v_dataset.r; // 当前点位距离占线总长的比例
|
||||
|
||||
if(u_linearColor == 1.0) { // 使用渐变颜色
|
||||
gl_FragColor = mix(u_sourceColor, u_targetColor, v_distance_ratio);
|
||||
gl_FragColor = mix(u_sourceColor, u_targetColor, d_distance_ratio);
|
||||
} else { // 使用 color 方法传入的颜色
|
||||
gl_FragColor = v_color;
|
||||
}
|
||||
|
|
@ -55,7 +51,7 @@ void main() {
|
|||
gl_FragColor.a *= opacity; // 全局透明度
|
||||
if(u_aimate.x == Animate) {
|
||||
animateSpeed = u_time / u_aimate.y;
|
||||
float alpha =1.0 - fract( mod(1.0- v_distance_ratio, u_aimate.z)* (1.0/ u_aimate.z) + animateSpeed);
|
||||
float alpha =1.0 - fract( mod(1.0- d_distance_ratio, u_aimate.z)* (1.0/ u_aimate.z) + animateSpeed);
|
||||
alpha = (alpha + u_aimate.w -1.0) / u_aimate.w;
|
||||
alpha = smoothstep(0., 1., alpha);
|
||||
gl_FragColor.a *= alpha;
|
||||
|
|
@ -63,17 +59,19 @@ void main() {
|
|||
// dash line
|
||||
if(u_line_type == LineTypeDash) {
|
||||
float flag = 0.;
|
||||
float dashLength = mod(v_distance_ratio, v_dash_array.x + v_dash_array.y + v_dash_array.z + v_dash_array.w);
|
||||
float dashLength = mod(d_distance_ratio, v_dash_array.x + v_dash_array.y + v_dash_array.z + v_dash_array.w);
|
||||
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)) {
|
||||
flag = 1.;
|
||||
}
|
||||
gl_FragColor.a *=flag;
|
||||
// gl_FragColor.a *=(1.0- step(v_dash_array.x, mod(v_distance_ratio, dashLength)));
|
||||
}
|
||||
|
||||
if(u_line_texture == LineTexture && u_line_type != LineTypeDash) { // while load texture
|
||||
float u = fract(mod(v_distance, v_pixelLen)/v_pixelLen - animateSpeed);
|
||||
float v = length(v_offset)/(v_a*2.0);
|
||||
float aDistance = v_dataset.g; // 当前顶点的距离
|
||||
float d_texPixelLen = v_dataset.b; // 贴图的像素长度，根据地图层级缩放
|
||||
float u = fract(mod(aDistance, d_texPixelLen)/d_texPixelLen - animateSpeed);
|
||||
float v = v_dataset.a;
|
||||
|
||||
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)));
|
||||
|
|
@ -98,7 +96,7 @@ void main() {
|
|||
// if(rV < r || rV > 1.0 - r) {
|
||||
// gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);
|
||||
// }
|
||||
// float v = length(v_offset)/(v_a*2.0);
|
||||
// float v = v_v;
|
||||
// if(v > 0.9) {
|
||||
// gl_FragColor = vec4(0.17647, 0.43921568, 0.2, 1.0);
|
||||
// } else if(v < 0.1) {
|
||||
|
|
|
|||
|
|
@ -27,14 +27,10 @@ uniform float u_icon_step: 100;
|
|||
varying vec4 v_color;
|
||||
varying vec4 v_dash_array;
|
||||
varying vec2 v_normal;
|
||||
varying float v_distance_ratio;
|
||||
varying float v_side;
|
||||
|
||||
varying float v_distance;
|
||||
varying vec2 v_offset;
|
||||
varying float v_size;
|
||||
varying float v_a;
|
||||
varying float v_pixelLen;
|
||||
varying vec4 v_dataset; // 数据集 - distance_ratio/distance/pixelLen/texV
|
||||
|
||||
varying float v_v; // 线图层 - 贴图部分的 v 坐标（线的宽度方向）
|
||||
varying vec2 v_iconMapUV;
|
||||
uniform float u_linearColor: 0;
|
||||
|
||||
|
|
@ -71,35 +67,42 @@ void main() {
|
|||
textureOffset = opacityAndOffset.g;
|
||||
// cal style mapping - 数据纹理映射部分的计算
|
||||
|
||||
float d_distance_ratio; // 当前点位距离占线总长的比例
|
||||
float d_texPixelLen; // 贴图的像素长度，根据地图层级缩放
|
||||
|
||||
v_iconMapUV = a_iconMapUV;
|
||||
v_distance = a_Distance;
|
||||
v_pixelLen = project_pixel(u_icon_step);
|
||||
d_texPixelLen = project_pixel(u_icon_step);
|
||||
if(u_CoordinateSystem == COORDINATE_SYSTEM_P20_2) {
|
||||
v_pixelLen *= 10.0;
|
||||
d_texPixelLen *= 10.0;
|
||||
}
|
||||
|
||||
if(u_line_type == LineTypeDash) {
|
||||
v_distance_ratio = a_Distance / a_Total_Distance;
|
||||
// v_distance_ratio = 0.01;
|
||||
d_distance_ratio = a_Distance / a_Total_Distance;
|
||||
v_dash_array = pow(2.0, 20.0 - u_Zoom) * u_dash_array / a_Total_Distance;
|
||||
}
|
||||
if(u_aimate.x == Animate || u_linearColor == 1.0) {
|
||||
v_distance_ratio = a_Distance / a_Total_Distance;
|
||||
d_distance_ratio = a_Distance / a_Total_Distance;
|
||||
}
|
||||
v_normal = vec2(reverse_offset_normal(a_Normal) * sign(a_Miter));
|
||||
|
||||
|
||||
v_color = a_Color;
|
||||
v_a = project_pixel(a_Size.x);
|
||||
|
||||
|
||||
vec3 size = a_Miter * setPickingSize(a_Size.x) * reverse_offset_normal(a_Normal);
|
||||
|
||||
vec2 offset = project_pixel(size.xy);
|
||||
|
||||
v_offset = offset + offset * sign(a_Miter);
|
||||
float lineOffsetWidth = length(offset + offset * sign(a_Miter)); // 线横向偏移的距离（向两侧偏移的和）
|
||||
float linePixelSize = project_pixel(a_Size.x) * 2.0; // 定点位置偏移，按地图等级缩放后的距离 单侧 * 2
|
||||
v_v = lineOffsetWidth/linePixelSize; // 线图层贴图部分的 v 坐标值
|
||||
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_side = a_Miter * a_Size.x;
|
||||
vec4 project_pos = project_position(vec4(a_Position.xy, 0, 1.0));
|
||||
|
||||
// gl_Position = project_common_position_to_clipspace(vec4(project_pos.xy + offset, a_Size.y, 1.0));
|
||||
|
|
|
|||
|
|
@ -24,31 +24,31 @@ export default class Amap2demo_lineLinear extends React.Component {
|
|||
const geoData = {
|
||||
type: 'FeatureCollection',
|
||||
features: [
|
||||
// {
|
||||
// type: 'Feature',
|
||||
// properties: {
|
||||
// testOpacity: 0.8,
|
||||
// },
|
||||
// geometry: {
|
||||
// type: 'Polygon',
|
||||
// coordinates: [
|
||||
// [
|
||||
// [113.8623046875, 30.031055426540206],
|
||||
// [116.3232421875, 30.031055426540206],
|
||||
// [116.3232421875, 31.090574094954192],
|
||||
// [113.8623046875, 31.090574094954192],
|
||||
// [113.8623046875, 30.031055426540206],
|
||||
// ],
|
||||
// [
|
||||
// [117.26806640625, 32.13840869677249],
|
||||
// [118.36669921875, 32.13840869677249],
|
||||
// [118.36669921875, 32.47269502206151],
|
||||
// [117.26806640625, 32.47269502206151],
|
||||
// [117.26806640625, 32.13840869677249],
|
||||
// ],
|
||||
// ],
|
||||
// },
|
||||
// },
|
||||
{
|
||||
type: 'Feature',
|
||||
properties: {
|
||||
testOpacity: 0.8,
|
||||
},
|
||||
geometry: {
|
||||
type: 'Polygon',
|
||||
coordinates: [
|
||||
[
|
||||
[113.8623046875, 30.031055426540206],
|
||||
[116.3232421875, 30.031055426540206],
|
||||
[116.3232421875, 31.090574094954192],
|
||||
[113.8623046875, 31.090574094954192],
|
||||
[113.8623046875, 30.031055426540206],
|
||||
],
|
||||
[
|
||||
[117.26806640625, 32.13840869677249],
|
||||
[118.36669921875, 32.13840869677249],
|
||||
[118.36669921875, 32.47269502206151],
|
||||
[117.26806640625, 32.47269502206151],
|
||||
[117.26806640625, 32.13840869677249],
|
||||
],
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue