认识Threejs

非 Y 不嫁゛ 提交于 2020-01-31 01:12:15

Threejs定义

 Threejs运行在浏览器的3d javascript库(three表示3D的意思,js表示javascript)

Three主要对象

1.场景(Scene):是物体、光源等元素的容器,
2.相机(Camera):控制视角的位置、范围以及视觉焦点的位置,一个3D环境中只能存在一个相机
3.渲染器(Renderer):指定渲染方式,如webGL\canvas2D\Css2D\Css3D等。
4.物体对象(Mesh):包括二维物体(点、线、面)、三维物体、粒子
5.光源(Light):包括全局光、平行光、点光源
6.控制器(Control): 相机控件,可通过键盘、鼠标控制相机的移动

场景(Scene)

物体、光源、控制器的添加必须使用secen.add(object)添加到场景中才能渲染出来。一个3D项目中可同时存在多个scene,通过切换render的scene来切换显示场景

var scene = new THREE.Scene(); // 创建场景对象
var mesh=scene.getObjectByName("sky");//获取场景中命名的name=sky的对象
方法 属性
add(object) 用于向场景中添加对象。使用该方法还可以创建对象组。(几何体、光源等对象)
children 用于返回一个场景中所有对象的列表,包括摄像机和光源。
getObjectByName(name,recursive) 在创建对象时可以指定唯一的标识 name,使用该方法可以查找特定名字的对象。当参数 recursive 设置为 false 时,在调用者子元素上查找,当参数 recursive 设置为 true 时,在调用者的所有后代对象上查找
remove(object) 用于向场景中添加对象。使用该方法还可以创建对象组。
fog 使用该属性可以为场景添加雾化效果,可以产生隐藏远处物体的浓雾效果。
overrideMaterial 使用该属性可以强制场景中的所有物体使用相同的材质。

相机(Camera)

相机根据投影方式分两种:正交投影相机和透视投影相机

正交投影相机:THREE.OrthographicCamera(left, right, top, bottom, near, far),大小不因远近而变化
透视投影相机:THREE.PerspectiveCamera(fov, aspect, near, far),遵循近大远小的空间规则

一般情况下,我们使用的是透视投影相机,其参数为:

 ![在这里插入图片描述](https://img-blog.csdnimg.cn/20200130151335169.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3R4Znl0ZWVu,size_16,color_FFFFFF,t_70) 
 ![在这里插入图片描述](https://img-blog.csdnimg.cn/20200130151336406.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3R4Znl0ZWVu,size_16,color_FFFFFF,t_70)
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!