three打造3d三位灯笼-html代码-BFW代码库

three打造3d三位灯笼

代码语言：html

所属分类：三维

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
body {
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  background: rgb(238,238,238);
  background: radial-gradient(circle, rgba(238,238,238,1) 0%, rgba(199,166,152,1) 53%, rgba(201,87,87,1) 100%);
  cursor: pointer;
}
</style>

</head>
<body translate="no">



<script type="x-shader/x-vertex" id="vs-lines">

uniform float globalTime;
uniform vec3 gravity;
uniform vec3 gravity2;
uniform float spacing;

attribute vec3 customColor;
attribute float seed;
attribute float seed2;
attribute float draw;
attribute float index2;
attribute vec3 norm;

varying vec3 vColor;
varying float vDraw;
varying vec3 vNormal;

void main() {

vDraw = draw;
vColor = customColor;

vec3 displacement = vec3(0.0,0.0,0.0);
vec3 forceDirection = vec3(0.0,0.0,0.0);

float displacementFactor = pow(index2, 1.5);
float displacementFactor2 = pow(index2, 3.5);
float displacementFactor3 = pow(1.0-index2, 1.0);
  
// "gravity"
vec3 g = gravity;
g.x *= displacementFactor2 * seed2;

// "wind"
forceDirection.x = sin(globalTime*0.01+seed2*0.75+index2*0.5) * 0.1*displacementFactor;
forceDirection.y = cos(globalTime*0.1+seed2*1.0+index2*1.0) * 0.1*displacementFactor;
forceDirection.z = sin(globalTime*0.1+seed2*0.5+index2*1.0) * 0.1*displacementFactor;

displacement = g + forceDirection + ((1.0-index2)*gravity2) * seed;

vec3 aNormal = norm;
aNormal.xyz += displacement*displacementFactor;

vNormal = norm*(1.0-index2);
vNormal += (gravity2-gravity)*0.05;

vec3 animated = position;

// curl it slightly
animated.x += aNormal.x*index2*20.0*displacementFactor3;

animated += aNormal*index2*(spacing*seed);

if (animated.y < -150.0+seed2*20.0) {
  animated.y = -150.0+seed2*20.0;
  vDraw = 0.0;
}

vec4 mvPosition = modelViewMatrix * vec4( animated, 1.0 );
gl_Position = projectionMatrix * mvPosition;

}

</script>
<script type="x-shader/x-fragment" id="fs-lines">

uniform vec3 color;

varying vec3 vColor;
varying float vDraw;
varying vec3 vNormal;

void main() {

if (vDraw == 0.0) {
  discard;
}

float depth = gl_FragCoord.z / gl_FragCoord.w;
float fogFactor = smoothstep( 450.0, 300.0, depth );            

vec3 light = vec3(1.0,1.0,1.0);
float d = pow(max(0.3,dot(vNormal.xyz, light))*2.0, 1.5);
gl_FragColor = vec4( (color * vColor) * d * fogFactor, 1.0 );

}

</script>

<script type="x-shader/x-vertex" id="vs-matcap">

        varying vec2 vN;

        void main() {

                vec3 e = normalize( vec3( modelViewMatri.........完整代码请登录后点击上方下载按钮下载查看