webgl实现三维空间可拖动鸟儿飞翔动画效果代码

代码语言:html

所属分类:三维

代码描述:webgl实现三维空间可拖动鸟儿飞翔动画效果代码

代码标签: webgl 三维 空间 拖动 鸟儿 飞翔 动画

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

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

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

  
  
  
<style>
body {
  margin: 0;
  display: grid;
}

label {
  font-family: courier;
  font-size: 25px;
  font-weight: bold;
  position: absolute;
  align-self: end;
  margin: 10px;
}
</style>


  
</head>

<body translate="no">
  <canvas id="myCanvas"></canvas>
<label>CLICK & DRAG to look around</label>
  
      <script  >
const canvas = document.getElementById('myCanvas');
const gl = canvas.getContext('webgl2');

const vertexShaderSource = `#version 300 es

in vec2 a_position;

void main() {
    gl_Position = vec4(a_position, 0.0, 1.0);
}
`;

const fragmentShaderSource = `#version 300 es

precision highp float;

uniform vec2 iResolution; // Declare as vec2 (canvas width and height)
uniform vec2 iMouse;
uniform float iTime;

out vec4 fragColor;

// Shadertoy code here

#define PI 3.14159265359
#define RES iResolution
#define PT iMouse
#define smin smoothmin
#define smax smoothmax
#define rot(a) mat2(cos(a-vec4(0,11,33,0)))


int partID = 0;

float smoothmin(float d1, float d2, float k) {
  float h = max(k - abs(d1 - d2), 0.) / k;
  return min(d1, d2) - h * h * k * (1. / 4.);
}

float smoothmax(float d1, float d2, float k) {
    float h = max(k - abs(d1 - d2), 0.) / k;
    return max(d1, d2) + h * h * k * (1. / 4.);
}

float sdSeg(in vec3 p, in vec3 a, in vec3 b) {
  vec3 pa = p - a, ba = b - a;
  float h = clamp(dot(pa, ba) / dot(ba, ba), 0., 1.);
  return length(pa - ba * h);
}

// Signed distance function for a 3D line segment
float map(vec3 p) {

  p.x+=1.; // centering the eagle

  vec3 p0 = p; // coordinates

  float beak = (length(p) - .5 + abs(p.z)*.75)/2.; // a sphere that has its radius limited in the z axis, resulting in a bifocal lens' shape 

  float bCut = beak; // saving the above for later

  beak = max(beak,-beak) - .01; // the solid is hollowed out, then thickened

  p.x-=.0;
  p.y+=.7;

  beak = max(beak, -(length(p.xy) - .9)); // the sol.........完整代码请登录后点击上方下载按钮下载查看

网友评论0