three.js 粒子水波纹效果
·

//决定片元着色器的颜色
varying vec3 vColor;
uniform float time;
uniform float size;
attribute vec3 color;
attribute vec3 oldColor;
attribute vec3 toPositions;
attribute vec3 oldPositions;
attribute float toPositionsDuration;
// attribute float scale;
void main() {
vec3 dispatchPos;
//顶点位置移动
//当前时间在点的运行时间中占比 0 -> 1
float percent = time / toPositionsDuration;
//用min限制 最大不超过1
percent = min(percent, 1.);
dispatchPos = oldPositions + percent * (toPositions - oldPositions);
vColor = oldColor + percent * (color - oldColor);
//旋转
vec4 modelPosition = modelMatrix * vec4(dispatchPos, 1.0);
float angle = atan(modelPosition.x, modelPosition.z);
float distanceToCenter = length(modelPosition.xy);
float angleOffset = (4.0 / distanceToCenter) * time * 0.7;
angle += angleOffset;
modelPosition.x = cos(angle);
modelPosition.z = sin(angle);
dispatchPos.xz += modelPosition.xz;
vec4 viewPosition = modelViewMatrix * vec4(dispatchPos, 1.0);
gl_Position = projectionMatrix * viewPosition;
//PointsMaterial材质的size属性和每个粒子随机的缩放 大小不一效果
// gl_PointSize = size * scale;
gl_PointSize = size;
//近大远小效果 值自己调节
gl_PointSize *= (120. / -(modelViewMatrix * vec4(dispatchPos, 1.0)).z);
}
更多推荐
所有评论(0)