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) 传入要观察的摄像机

  


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值