Three.js 学习记录(3) ----Scene(场景)

一、基本介绍

从官网的的文档关于scene的API描述中可以看出，scene继承于Object3D。查看源码Scene.js文件也看可以佐证:

//Scene对象从THREE.Objec3D的原型继承所有属性方法
THREE.Scene.prototype = Object.create( THREE.Object3D.prototype );  

那么Scene除了拥有Object3D对象的属性和方法外，还拥有自己的一些，下面分别介绍。

1、作用

Scene是场景对象,所有的对象,灯光,动画,骨骼等都需要放置在场景内.

2、常用属性

属性名	描述
fog	设置场景的雾化效果,可以渲染出一层雾气,隐层远处的的物体.
overrideMaterial	强制场景中所有物体使用相同的材质。
autoUpdate	暂时没有用到
background	暂时没有用到
children	继承而来,所有对象的列表

3、常用方法

方法名	描述
add()	继承而来,向场景中添加对象。
remove()	继承而来,从场景中移除对象。
getChildByName()	继承而来根据名字直接返回这个对象。
traverse()	传入一个回调函数访问所有的对象。

二、属性示例

• 针对一些常用的属性和方法做简单的代码使用示例。
• 对于属性的类型为指针时,就要使用new 关键字，如fog和overrideMaterial属性。

下面代码摘自three.js文件：

THREE.Scene = function () {
    THREE.Object3D.call( this );
    this.type = 'Scene';
    this.fog = null;
    this.overrideMaterial = null;
    this.autoUpdate = true; // checked by the renderer
};

1、fog雾化效果

在定义完场景后加上雾化属性。

  //定义一个白色的雾化效果(0xffffff)
//THREE.Fog = function ( color, near, far )
 scene.fog = new THREE.Fog(0xffffff, 0.015, 100);

题外话：
THREE.Fog()为全局函数可直接调用,在src/scenes/Fog.js文件中定义。

2、overrideMaterial覆盖材料

所有对象都用相同的材质和颜色渲染.

//定义一个材料颜色为白色,详细材料的介绍关注下面的更新内容作。
var scene = new THREE.Scene();
scene.overrideMaterial = new THREE.MeshLambertMaterial({color: 0xffffff});

三、方法示例

方法使用比较直接易懂。

scene.add(plane); 
scene.remove(plane);