three打造一个三维多彩玉石旋转动画效果代码
代码语言:html
所属分类:三维
代码描述:three打造一个三维多彩玉石旋转动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> * { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } body { height: 100vh; background-color: #000; margin: 0; padding: 0; overflow: hidden; position: relative; } </style> </head> <body translate="no" > <!-- Shader Collab * By eliza & ilithya | 2020 * * https://www.elizasj.com/ * https://twitter.com/iamelizasj * * https://www.ilithya.rocks/ * https://twitter.com/ilithya_net --> <div id="shadercollab"></div> <script id="vertex" type="x-shader/x-vertex"> void main() { gl_Position = vec4(position, 1.0); } </script> <script id="fragment" type="x-shader/x-vertex"> precision highp float; uniform vec2 u_resolution; uniform float u_time; const int RAYMARCH_MAX_STEPS = 200; const float RAYMARCH_MAX_DIST = 10.; const float EPSILON = 0.0001; // Pallete function by Inigo Quilez - iquilezles.org // a - brigthness, b - contrast, c - osc, d - phase vec3 palette(in float t, in vec3 a, in vec3 b, in vec3 c, in vec3 d) { return a + b*cos( 6.28318*(c*t+d) ); } // Got rotation functions from akella - twitter.com/akella mat4 rotationMatrix(vec3 axis, float angle) { axis = normalize(axis); float s = sin(angle); float c = cos(angle); float oc = 1.0 - c; return mat4(oc * axis.x * axis.x + c, oc * axis.x * axis.y - axis.z * s, oc * axis.z * axis.x + axis.y * s, 0.0, oc * axis.x * axis.y + axis.z * s, oc * axis.y * axis.y + c, oc * axis.y * axis.z - axis.x * s, 0.0, oc * axis.z * axis.x - axis.y * s, oc * axis.y * axis.z + axis.x * s, oc * axis.z * ax.........完整代码请登录后点击上方下载按钮下载查看
网友评论0