canvas+webgl实现三维神庙教堂内效果代码

代码语言:html

所属分类:三维

代码描述:canvas+webgl实现三维神庙教堂内效果代码

代码标签: canvas webgl 三维 神庙 教堂

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

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

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


  
  
<style>
body { margin: 0; overflow: hidden; }
</style>


  
</head>

<body translate="no">
  <canvas id="myCanvas"></canvas>
  
      <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

float d0 = 120.;

// Signed distance function for a plane
float sdPlane(vec3 p, vec3 n, float h) {
  return dot(p, n) + h;
}

f.........完整代码请登录后点击上方下载按钮下载查看

网友评论0