three.js绘制过程(二)

同一个场景中可以有多个摄像机，同一个屏幕缓冲区可以分块绘制不同的物体。

 

WeblGLRender 中autoClear 设定为false之后， 每次绘制不会清空缓冲区；

setSize 设定canvas的大小

setViewport 设定绘制的位置的大小

clear() 手动清空绘制缓冲区

 

例如有两个摄像机A B；

将autoClear设定为false，

在绘制函数中 

开始手动清空缓冲区clear()

setViewport (0 0， Width/2, height) 左侧可以绘制第一个摄像机的看到的场景，

render() 

setViewport(width/2, 0, width/2, height) 右侧可以绘制第二个摄像机的场景

render()

 

这样就可以在一个屏幕上绘制两个摄像机的看到的场景。

 

CameraHelper:

THREE 中有 CameraHelper类可以帮助确定场景中摄像机的位置，和可视见范围， 本质上是一个场景节点。

CameraHelper 本身是一个Object3D, 可以作为摄像机的子节点， 这样就可以保证和摄像机一起移动。

CameraHelper的update函数， 当观察的摄像机参数改变， 比如fov， far平面， 则需要更新helper的状态。

 

构造函数 CameraHelper(camera) 传入要观察的摄像机