Skip to content

Garden 园区

用于构建一个可容纳多个模型的集合体,一个Container中只会同时渲染一个园区,但你可以构建多个园区,由同一个Container来管理,从而实现不同园区的切换效果

园区之间的切换

图片也可以随时更换

本案例还额外使用到了园区的生命周期showhide函数,用于园区每次显示和隐藏时触发

摄像机变更回调

如果希望在摄像机变化的时候,做一些事情,那么可以使用ICameraGarden实现该接口提供的方法即可

园区交互

如果希望在与园区中的模型进行一些交互,那么可以使用IMouseGarden实现该接口提供的方法,同时使用addTouchModel方法设置对应模型可交互即可

如果在某些时候你希望某个模型不再能够交互了,可以使用removeTouchModel即可,参数为每个模型的唯一编号UUID

天空盒

设置园区天空盒

dir:目录地址,默认值为'./skybox/'

urls:天空盒资源地址,默认值为['px.jpg', 'nx.jpg', 'py.jpg', 'ny.jpg', 'pz.jpg', 'nz.jpg'],如果手动传,请按照指定顺序传输:右、左、上、下、前、后

environment:是否将天空盒生效于环境贴图中

HDR

通过传入指定的天空盒资源路径,即可快速构建天空盒

Options

属性名说明类型默认值
touchModels可交互模型集合RTHREE.Object3D[][]
composer效果合成器(需要使用createBasePass进行初始化)EffectComposer-
renderPass渲染器(需要使用createBasePass进行初始化)RenderPass-
levelStrategys分级策略集合RTHREE.LOD[][]

Methods

constructor(contianer: Container, originalLight = true)

构造函数

originalLight:是否开启默认光照系统

addTouchModel(models: RTHREE.Object3D | RTHREE.Object3D[])

追加可交互模型

removeTouchModel(uuids: string | string[])

移除可交互模型

createBasePass()

构建基础后期通道(包含合成器、渲染器、SSAA抗锯齿),当你需要使用后期特效中的功能时,请先使用该方法

render()

园区渲染函数,如果您使用了分级策略功能,那么需要使用该方法来渲染

setAntiAlias(antiAlias: EAntiAlias)

设置抗锯齿通道(使用前,请先试用createBasePass构建基础后期通道

EAntiAlias.SSAA:SSAA抗锯齿

EAntiAlias.FXAA:FXAA抗锯齿

EAntiAlias.SMAA:SMAA抗锯齿

EAntiAlias.NONE:关闭抗锯齿

createBloomPass(options?: IBloomOptions)

创建辉光通道(使用前,请先试用createBasePass构建基础后期通道

IBloomOptions

属性名说明类型
strength强度number
radius半径number
threshold阙值number

createExposurePass

创建曝光度修正通道