three+webgl实现立体空间数字时间代码
代码语言:html
所属分类:其他
代码描述:three+webgl实现立体空间数字时间代码
代码标签: three webg 立体 空间 数字 时间 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> html, body { height: 100%; margin: 0; overflow: hidden; } canvas { width: 100%; height: 100%; display; block; } #player { position: absolute; bottom: 0; right: 0; } </style> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.96.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.min.js"></script> </head> <body > <!--script src="https://threejs.org/examples/js/controls/OrbitControls.js"></script--> <script> var lineVertShader = ` #define dig0 !(digit != -1.0 && digit != 1.0 && digit != 4.0) #define dig1 !(digit != -1.0 && digit != 1.0 && digit != 2.0 && digit != 3.0 && digit != 7.0) #define dig2 !(digit != -1.0 && digit != 5.0 && digit != 6.0) #define dig3 !(digit != -1.0 && digit != 0.0 && digit != 1.0 && digit != 7.0) #define dig4 !(digit != -1.0 && digit != 1.0 && digit != 3.0 && digit != 4.0 && digit != 5.0 && digit != 7.0 && digit != 9.0) #define dig5 !(digit != -1.0 && digit != 2.0) #define dig6 !(digit != -1.0 && digit != 1.0 && digit != 4.0 && digit != 7.0) #define cond(a) if(int(idx + 0.1) == (a) && #define retVal ){return 1.0;} uniform float digit; attribute float idx; varying float vOff; varying vec2 vUv; float isOff(){ cond(0) dig0 retVal else cond(1) dig1 retVal else cond(2) dig2 retVal else cond(3) dig3 retVal else cond(4) dig4 retVal else cond(5) dig5 retVal else cond(6) dig6 retVal //return 1.0; } void main() { vOff = isOff(); vUv = uv; vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 ); gl_Position = projectionMatrix * mvPosition; } `; var lineFragShader = ` uniform vec3 diffuse1; uniform vec3 diffuse2; varying float vOff; varying vec2 vUv; void main() { if (vOff > 0.5) discard; gl_FragColor = vec4( mix(diffuse1, diffuse2, vUv.y), 1.0 ); } `; </script> <script > var scene = new THREE.Scene(); var camera = new THREE.PerspectiveCamera(60, 1, 0.1, 1000); var pos = new THREE.Vector3(0, 0.5, 7); //camera.position.set(0, 0.5, 7); var renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setClearColor(0x050005); renderer.setPixelRatio(0.5); var canvas = renderer.domElement; docu.........完整代码请登录后点击上方下载按钮下载查看
网友评论0