寫一個會旋轉的立方體
阿新 • • 發佈:2017-08-05
mat rspec idt cti document request asi pos function
<!DOCTYPE html> <html lang="en"> <head> <title></title> <meta charset="utf-8"> <script src="../three.js"></script> </head> <body> <script> var scene = new THREE.Scene(); //初始化場景 var camera = newTHREE.PerspectiveCamera(75,window.innerWidth/window.innerHeight,1,10000);//初始化相機,角度,縱橫比,最近,最遠 var renderer = new THREE.WebGLRenderer(); //初始化渲染器 renderer.setSize(window.innerWidth,window.innerHeight);//設置渲染器的大小 document.body.appendChild(renderer.domElement);//將渲染器渲染到網頁裏面 vargeometry = new THREE.CubeGeometry(1,1,1);//新建一個立方體 var material = new THREE.MeshBasicMaterial({color:0xffffff});//設置立方體到材質 var cube = new THREE.Mesh(geometry,material); scene.add(cube);//將立方體加入到場景裏面 camera.position.z=3;//設置相機的位置坐標,沒有相機的位置就不知道以什麽唯獨渲染 function render(){ requestAnimationFrame(render);//循環渲染 cube.rotation.x+=0.01;//應該是旋轉方向的速率 cube.rotation.y+=0.01; renderer.render(scene,camera); } render(); </script> </body> </html>
寫一個會旋轉的立方體