wtc-simplegl+wtc-math+webgl实现三维粒子小球动画效果代码

代码语言:html

所属分类:三维

代码描述:wtc-simplegl+wtc-math+webgl实现三维粒子小球动画效果代码

代码标签: wtc-simplegl wtc-math webgl 三维 粒子 小球 动画

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

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">

  
  
<style>
body {
    background: #333;
    color: #fff;
    font-family: sans-serif;
  }
  body,
  html {
    margin: 0;
    overflow: hidden;
    padding: 0;
  }
  canvas { width:100%; height: 100%; }
</style>

  
  
</head>

<body translate="no">
  <script type="x-shader/x-vertex" id="vert">#version 300 es

layout(location=0) in float a_id;
layout(location=1) in vec2 a_something;
layout(location=5) in vec3 a_position;

out vec3 v_position;
out float v_id;
out vec2 v_something;
out vec3 lp;

uniform vec2 u_resolution;
uniform mat4 u_viewMatrix;
uniform mat4 u_viewProjectionMatrix;
uniform mat4 u_modelViewMatrix;
uniform float u_time;

void main() {
  float id = a_id*200.;
  v_position = a_position;
  v_id = a_id;
  v_something = a_something;
  vec3 p = a_position + vec3(cos(u_time+id)*.2, sin(u_time+id)*.2, 0);
  
  float m = 1./(u_resolution.x/u_resolution.y);
  
  
  vec4 position = u_viewProjectionMatrix * vec4(p, 1.);
  
  
  mat3 viewmat = mat3(u_viewMatrix);
  vec3 lightWorldPosition = vec3(50, 100, 50);  // The world space position of the light
  vec3 viewSpacePos = viewmat * p;  // Transform to view space
  vec3 lightViewPosition = viewmat * lightWorldPosition;  // Transform to view space
  lp = normalize(lightViewPosition - viewSpacePos);  // Direction from point to light in view space

  // lp = normalize((u_viewProjectionMatrix * vec4((p - vec3(20,20,0)), .........完整代码请登录后点击上方下载按钮下载查看

网友评论0