three打造霓虹石星空旋转效果
代码语言:html
所属分类:粒子
代码描述:three打造霓虹石星空旋转效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body translate="no">
<script id="vertexShader" type="x-shader/x-vertex">
attribute vec3 color;
uniform float time;
uniform float size;
varying vec4 vMvPosition;
varying vec3 vColor;
float map(float value, float beforeMin, float beforeMax, float afterMin, float afterMax) {
return afterMin + (afterMax - afterMin) * ((value - beforeMin) / (beforeMax - beforeMin));
}
void main() {
vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);
vMvPosition = mvPosition;
vColor = color;
gl_PointSize = (size + map(sin(time * 0.05), -1.0, 1.0, -100.0, 100.0)) * (100.0 / length(mvPosition.xyz));
gl_Position = projectionMatrix * mvPosition;
}
</script>
<script id="fragmentShader" type="x-shader/x-fragment">
uniform sampler2D texture;
uniform float time;
varying vec4 vMvPosition;
varying vec3 vColor;
void main() {
float opacity = 200.0 / length(vMvPosition.xyz);
vec2 uv = gl_PointCoord.xy * 2.0 - 1.0;
float orb = 0.1 / length(vec2(0.0) - uv) * step(0.5, 1.0 - length(uv));
orb = smoothstep(0.0, 1.0, orb);
vec3 color = vec3(orb) * vColor;
gl_FragColor = vec4(color, 1.0);
}
</script>
<script type="text/javascript" src="http://repo.bfw.........完整代码请登录后点击上方下载按钮下载查看
网友评论0