3.案例中使用透视相机(从视点开始越近的物体越大、远处的物体绘制的较小的一种方式、和日常生活中我们看物体的方式是一致的。)
4.设置相机的上方向为正方向y轴 camera.up.x = 0; camera.up.y = 1; //相机朝向--相机上方为y轴camera.up.z = 0;
camera.up.x = 0; camera.up.y = 1; //相机朝向--相机上方为y轴 camera.up.z = 0;
三.关于透视相机相关参数说明
new THREE.PerspectiveCamera(fov, aspect , near,far) 透视相机
视野角:fov 这里视野角(有的地方叫拍摄距离)越大,场景中的物体越小,视野角越小,场景中的物体越大
纵横比:aspect
相机离视体积最近的距离:near
相机离视体积最远的距离:far
上述案例动画原理 相机围绕y轴旋转,并且保持场景中的物体一直再相机的视野中,实时将相机拍摄下来的图片,放到浏览器中去显示
function animation(){ //相机围绕y轴旋转,并且保持场景中的物体一直再相机的视野中 //实时渲染成像 var timer = Date.now()*0.0001; camera.position.x = Math.cos(timer)*100; camera.position.z = Math.sin(timer)*100; camera.lookAt(scene.position); renderer.render(scene, camera); requestAnimationFrame(animation); }
四.渲染器 三维空间里的物体映射到二维平面的过程被称为三维渲染。 一般来说我们都把进行渲染的操作叫做渲染器。
【参考资料】