Three.js基础部分学习(2)

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

Three.js基础部分学习

Three.js基础部分学习

上述案例动画原理  相机围绕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); }

四.渲染器  三维空间里的物体映射到二维平面的过程被称为三维渲染。 一般来说我们都把进行渲染的操作叫做渲染器。

【参考资料】 

https://read.douban.com/reader/ebook/7412854/

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wwjyfg.html