Skip to content

SceneManager

场景管理器类,负责管理3D场景中的所有组件,包括几何场景、CSS场景、灯光、相机和数据。作为整个3D场景的核心管理器,协调各个子管理器的功能。

类定义

javascript
class SceneManager extends EventManager

属性

geometryScene

获取几何元素场景,返回用于存储3D几何对象的场景实例。这个场景包含所有的3D模型、几何体和相关的3D对象。

类型: {GeometryScene}
只读: true

示例:

javascript
// 获取几何场景
const geometryScene = sceneManager.geometryScene;

// 添加3D模型到几何场景
geometryScene.add(model);

cssScene

获取CSS元素渲染场景,返回用于存储2D CSS对象的场景实例。这个场景包含所有的2D标签、UI元素和CSS2D对象。

类型: {CssScene}
只读: true

示例:

javascript
// 获取CSS场景
const cssScene = sceneManager.cssScene;

// 添加2D标签到CSS场景
cssScene.add(css2DObject);

lightManger

获取灯光管理器,返回场景中的灯光管理器实例。灯光管理器负责管理场景中的所有灯光,包括环境光、半球光、平行光等。

类型: {LightManager}
只读: true

示例:

javascript
// 获取灯光管理器
const lightManager = sceneManager.lightManger;

// 启用阴影
lightManager.shadow = true;

// 设置阴影范围
lightManager.directionalLightShadow = 1000;

cameraManager

获取相机管理器,返回场景中的相机管理器实例。相机管理器负责管理场景中的相机和轨道控制器,提供相机控制功能。

类型: {CameraManager}
只读: true

示例:

javascript
// 获取相机管理器
const cameraManager = sceneManager.cameraManager;

// 获取透视相机
const camera = cameraManager.perspectiveCamera;

// 设置相机到包围球
cameraManager.fitToSphere(boundingSphere, true);

sceneBoundingBox

获取场景包围盒子,返回场景的包围盒实例。包围盒用于计算场景中所有对象的边界,用于相机定位和场景分析。

类型: {Box3}
只读: true

示例:

javascript
// 获取场景包围盒
const boundingBox = sceneManager.sceneBoundingBox;

// 计算包围盒大小
const size = boundingBox.getSize(new Vector3());
console.log('场景大小:', size);

sceneBoundingSphere

获取场景包围球体,返回场景的包围球实例。包围球用于计算场景中所有对象的球形边界,用于相机定位和场景分析。

类型: {Sphere}
只读: true

示例:

javascript
// 获取场景包围球
const boundingSphere = sceneManager.sceneBoundingSphere;

// 计算包围球半径
console.log('场景半径:', boundingSphere.radius);

dataManager

获取数据管理器,返回场景中的数据管理器实例。数据管理器负责管理场景中的所有数据,包括3D模型、2D对象和属性数据。

类型: {DataManager}
只读: true

示例:

javascript
// 获取数据管理器
const dataManager = sceneManager.dataManager;

// 添加3D模型
dataManager.addModel('building', model);

// 添加2D标签
dataManager.add2DModel('label', css2DObject);

models

获取模型组,返回数据管理器中的所有模型数组。这些模型是经过处理的3D模型。

类型: {Array<Model>}
只读: true

示例:

javascript
// 获取所有模型
const models = sceneManager.models;

// 遍历模型
models.forEach(model => {
    console.log('模型名称:', model.name);
});

instancedGroups

获取实例化组,返回数据管理器中的所有实例化组数组。实例化组用于管理相同几何体的多个实例。

类型: {Array<Group>}
只读: true

示例:

javascript
// 获取所有实例化组
const instancedGroups = sceneManager.instancedGroups;

// 遍历实例化组
instancedGroups.forEach(group => {
    console.log('实例化组子对象数量:', group.children.length);
});

mergedGroups

获取合并化组,返回数据管理器中的所有合并化组数组。合并化组用于管理合并后的几何体,减少绘制调用次数。

类型: {Array<Group>}
只读: true

示例:

javascript
// 获取所有合并化组
const mergedGroups = sceneManager.mergedGroups;

// 遍历合并化组
mergedGroups.forEach(group => {
    console.log('合并化组子对象数量:', group.children.length);
});

singleGroups

获取独立化组,返回数据管理器中的所有独立化组数组。独立化组用于管理独立的几何体,每个对象都是单独的实例。

类型: {Array<Group>}
只读: true

示例:

javascript
// 获取所有独立化组
const singleGroups = sceneManager.singleGroups;

// 遍历独立化组
singleGroups.forEach(group => {
    console.log('独立化组子对象数量:', group.children.length);
});

方法

instancedObjectsVisible

设置实例化元素的可见性,设置所有实例化组中元素的可见性。遍历所有实例化组,设置每个子对象的可见性。

参数:

  • boolean {Boolean} - 可见性状态,true为可见,false为隐藏

示例:

javascript
// 隐藏所有实例化对象
sceneManager.instancedObjectsVisible = false;

// 显示所有实例化对象
sceneManager.instancedObjectsVisible = true;

mergedObjectsVisible

设置合并化元素的可见性,设置所有合并化组中元素的可见性。遍历所有合并化组,设置每个子对象的可见性。

参数:

  • boolean {Boolean} - 可见性状态,true为可见,false为隐藏

示例:

javascript
// 隐藏所有合并化对象
sceneManager.mergedObjectsVisible = false;

// 显示所有合并化对象
sceneManager.mergedObjectsVisible = true;

singleObjectsVisible

设置独立化元素的可见性,设置所有独立化组中元素的可见性。遍历所有独立化组,设置每个子对象的可见性。

参数:

  • boolean {Boolean} - 可见性状态,true为可见,false为隐藏

示例:

javascript
// 隐藏所有独立化对象
sceneManager.singleObjectsVisible = false;

// 显示所有独立化对象
sceneManager.singleObjectsVisible = true;

setModelVisible(bool)

设置模型组的可见性,设置所有实例化组的可见性。通过设置实例化组的父对象的可见性来控制整个组的显示状态。

参数:

  • bool {Boolean} - 可见性状态,true为可见,false为隐藏

示例:

javascript
// 隐藏所有模型组
sceneManager.setModelVisible(false);

// 显示所有模型组
sceneManager.setModelVisible(true);

getSceneCenter()

获取场景的中心点,计算并返回场景包围盒的中心点。这个中心点可以用于相机定位、对象居中显示等操作。

返回值:

  • {Vector3} 场景中心点的Vector3对象

示例:

javascript
// 获取场景中心点
const center = sceneManager.getSceneCenter();
console.log('场景中心:', center);

// 将相机定位到场景中心
camera.position.copy(center);

releaseMemory()

释放内存资源,遍历几何场景和CSS场景中的所有对象,释放几何体和材质的GPU内存。这个方法用于清理场景中的资源,防止内存泄漏。

示例:

javascript
// 释放场景内存
sceneManager.releaseMemory();

// 在场景切换时调用
sceneManager.releaseMemory();
sceneManager.dispose();

dispose()

回收资源,释放场景管理器中的所有资源,包括内存清理和相机管理器的资源回收。这个方法应该在场景不再使用时调用,确保所有资源都被正确释放。

示例:

javascript
// 回收场景管理器资源
sceneManager.dispose();

// 在应用关闭时调用
window.addEventListener('beforeunload', () => {
    sceneManager.dispose();
});

子类

GeometryScene

几何元素场景类,继承自Three.js的Scene类,专门用于管理3D几何元素。

类定义:

javascript
class GeometryScene extends Scene

属性:

  • name {string} - 场景名称,默认为'GeometryScene'

示例:

javascript
// 创建几何场景
const geometryScene = new GeometryScene();

// 添加3D模型到场景
geometryScene.add(model);

CssScene

CSS元素场景类,继承自Three.js的Scene类,专门用于管理2D CSS元素。

类定义:

javascript
class CssScene extends Scene

属性:

  • name {string} - 场景名称,默认为'CssScene'

示例:

javascript
// 创建CSS场景
const cssScene = new CssScene();

// 添加2D标签到场景
cssScene.add(css2DObject);

使用场景

场景管理

  • 管理3D几何场景和2D CSS场景
  • 协调各个子管理器的功能
  • 提供统一的场景访问接口

对象可见性控制

  • 批量控制不同类型对象的显示和隐藏
  • 实现场景的层次化显示

边界计算

  • 计算场景的包围盒和包围球
  • 为相机定位提供参考
  • 支持场景的自动适配

内存管理

  • 提供场景对象的清理功能
  • 防止内存泄漏

相关链接

文档内容为北京逆维悦动科技有限公司版权所有,禁止未授权转载