主类

Mar-27-2023 11-29-46.gif

前言

本文正在参加「金石计划」 上一篇文章介绍了Mool3D中模型类的使用，引擎的设计思想主要与继承主类的形式完成扩展开发，所以我们离不开对主类的了解，本篇文章我们就重点对主类在设计与使用上做一个详细的介绍～

Viewer

构成

首先要明白主类的作用，在Mool3D引擎中viewer主类主要作为一个承载体的形式，提供对场景中所以物体、灯光等做一个统一管理。

  sceneA = new Index({
    el: el as HTMLElement,
    tween: TWEEN,
    path: "../public/scene/",
    bus: bus,
  });

data

以下是主类下挂载的对象及其的作用

  clock: THREE.Clock; //时钟
  animate: ViewerAnimate; //帧动画执行类
  gAmGroup: THREE.Group[]; //环境场景
  gRayGroup: THREE.Group[]; //鼠标拾取场景
  gScenes: THREE.Scene[]; //主场景
  gStatus: boolean[]; //场景是否存于内存
  scene: THREE.Scene; //场景容器
  model: ViewerModel; //模型类
  sceneidx: number; //场景id
  cameraClass: ViewerCamera; //相机类
  activeCamera: THREE.Camera; //激活相机
  renderer: THREE.WebGLRenderer; //渲染
  controls: ViewerControl; //控制器类
  ambient: ViewerAmbient; //环境光
  hemisphereLight: ViewerSkyLight; //半球光
  directional: ViewerDirectional; //平行光
  pointGroup: PointLightType[]; //点光源组合
  spotLight: ViewerSpot; //聚光灯
  rectAreaLight: ViewerRectArea; //区域光
  sky: ViewerSky; //天空
  environment: ViewerEnvironment; //环境贴图
  event: ViewerEvent; //事件
  souce: ViewerSource; //资源加载类
  parade: ViewerParade;
  spriteGroup: THREE.Object3D[];
  fog: ViewerFog; //雾
  water: ViewerWater; //水
  roam: ViewerRoam; //漫游
  options: ViewerParams; //实例参数

方法

主类下不只是提供了一系列对象对场景做一个统一的管理，还作为一个承载体的形式提供各种插件的一个初始化方法。下方我就不贴具体代码了，有感兴趣的可以去已经开源的引擎中查看代码～

createScene

内置方法，主要作用是通过循环生成多个空的场景容器，为了方便后续切换不同场景减少重复加载～

initAnimate

内置方法，初始化帧动画函数，将帧动画类挂载在主类的animate对象下供代码扩展中使用～

initSky

初始化天空盒子，调用初始化天空盒子将挂载在主类的sky对象下，提供两种形式的天空盒子选择。需通过sky下的两个添加天空盒子的方式将其添加到场景中～

initEnvironment

初始化环境贴图，调用初始化环境贴图将挂载在主类的environment对象下，提供两种格式的环境贴图exr和hdr，传入贴图名称和类型，贴图默认存放位置为主类初始化中传入的path下～

initEvent

初始化事件管理器，调用初始化环境贴图将挂载在主类的event对象下，主要管理鼠标事件对可选中模型的拾取情况，并以回调的形式供扩展使用～

initRender

内置方法，提供渲染函数挂载在renderer对象下～

initControls

内置方法，提供控制器的初始化，挂载在controls对象下，默认只会加载轨道控制器～

initModel

初始化模型类的方法，提供初始化模型类并挂载在model对象下，具体可以看上一篇模型类使用的文章～

initAmbient

内置方法，默认加载环境光，可以通过ambient对象去修改灯光的属性～

initSkyLight

初始化半球光方法，调用初始化将挂载在hemisphereLight对象下，传入颜色及亮度～

initDirectional

初始化平行光类，调用初始化将挂载在directional对象下，传入颜色及亮度～

initPointLight

初始化点光源类，调用初始化将挂载在pointGroup组合下，传入颜色、亮度、距离～

initSpotLight

初始化聚光灯类，调用初始化将挂载在spotLight下，传入颜色、亮度、距离～

initRectArea

单个区域光类，调用初始化方法将挂载在rectAreaLight下，传入颜色、宽度、高度、亮度～

initRectAreaBox

初始化光盒类，调用初始化方法将挂载在rectAreaLight下，传入颜色、宽度、亮度、位置～

initFog

初始化雾，调用初始化将挂载在fog下，有两种雾提供选择，需在初始化后调用添加到场景中～

initWater

初始化水，调用将挂载在water下，由于参数较多可以去文档中查看使用方法～

initSource

初始化资源类，调用将挂载在souce下，这边建议图片等一些资源加载统一通过资源加载类进行加载～

loadSprite

初始化粒子，提供粒子初始化将挂载在spriteGroup组合下，返回一个粒子对象需自行添加到场景中～

initParade

初始化巡游类，初始化将挂载在parade下，这里只是类的初始化，如需实现巡游还需通过巡游类中的方法完成～

initParticleEngine/getParticleTween/setParticleMode

初始化粒子系统，提供粒子系统的初始化还需配合setParticleMode选择粒子模式和getParticleTween粒子过渡动画来使用～

initRoam

第三人称漫游类，这里只提供初始化将挂载在roam下，要完成漫游类还比较复杂的代码，有感兴趣的可以留言，后续我单独写一篇文章来介绍～

setScene

切换场景方法，传入场景id，提供场景切换成功回调～

flyTo

相机飞行方法，提供相机飞行过渡函数～

destroy

场景销毁方法

结语

本篇文章主要对主类viewer下的所有东西做了一个总体简单的介绍，如需深入了解可以通过主页的github下载Mool3d-docs文档来查看具体的用法，有不明白的欢迎留言👏，创作不易留下你的点赞～

Mool3D主类的介绍

主类

前言