# 简介

Tx3d Engine3.0是由华夏天信推出的基于WebGL的面向能源行业的三维可视化开发框架。Tx3d Engine目前支持煤矿、地质、地图、点云、倾斜摄影等GIS数据的三维可视化，同时提供丰富的渲染和逻辑控制组件，以及丰富的分析和编辑工具。

# 架构

Tx3d Engine由核心层、扩展层、应用层组成，如下图所示：

avatar

# 扩展

如上图所示，扩展包是基于核心包（@tx3d/core3.42.8）封装的功能模块集合，当前包含以下扩展：

🌏 @tx3d/extension3.30.8 功能扩展包，提供编辑工具、测量工具、3D图表、渲染组件、逻辑控制组件等。

🌏 @tx3d/particlesystem3.9.6 粒子系统包，提供实现火、烟雾、爆炸、雨、雪、雾等粒子效果。

🌏 @tx3d/postprocessing3.7.3 后期处理包，提供曝光、描边、景深、模糊、颜色校正、色调映射等后期处理效果。

🌏 @tx3d/tilemap3.6.3 瓦片地图包，提供互联网瓦片地图及华夏天信CAD瓦片地图的渲染绘制。

🌏 @tx3d/tiles3d3.2.5 3D瓦片包，提供3D瓦片数据的渲染绘制（注：目前只支持点云和倾斜摄影数据绘制）。

🌏 @tx3d/potree3.1.0 点云包，提供potree格式点云数据渲染绘制。

🌏 @tx3d/physics3.4.0 物理包，提供碰撞体、刚体、柔体碰撞检测以及约束限制等物理功能。

🌏 @tx3d/webxr3.1.3 webxr包，用于实现WebVR和WebAR场景。

🌏 @tx3d/ventilation3.11.2 通风包，提供通风模拟解算功能及通风编辑相关工具。

# 使用

使用Tx3d Engine开发时必须引入核心包（ @tx3d/core ），其它扩展包可以根据实际需求按需引入。

🌏 通过HTML脚本标记

提示

由于Tx3d Engine依赖于ES Module (opens new window)，因此任何引用Tx3d Engine开发包的 script 标签必须使用 type="module"。此外，由于Tx3d Engine依赖three.js(v0.172.0) (opens new window)，所以也需要引入three.js相关代码。

<body>
    <script async src="https://unpkg.com/es-module-shims@1.6.3/dist/es-module-shims.js"></script>
    <script type='importmap'>
        {
            "imports": {
                "three": "https://cdn.jsdelivr.net/npm/three@0.172.0/build/three.module.js",
                "three/examples/jsm/": "https://cdn.jsdelivr.net/npm/three@0.172.0/examples/jsm/",
                "@tx3d/core": "../dist/tx3d.core.js",
                "@tx3d/extension": "../dist/tx3d.extension.js"
            }
        }
    </script>
    <script type="module">
        // 引入three对象
        import { Vector3 } from 'three';

        // 引入three示例包中对象
        import { LineSegments2 } from 'three/examples/jsm/lines/LineSegments2.js';

        // 引入核心包对象
        import { Engine } from '@tx3d/core';

        // 引入扩展包对象
        import { BoundHelper } from '@tx3d/extension';
    </script>
</body>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26

🌏 通过公司的私有npm进行安装

安装

// 先登录私有仓库
npm adduser --registry https://npm.txiiot.cn

// 安装核心包
npm install @tx3d/core --save --registry https://npm.txiiot.cn

// 安装扩展包
npm install @tx3d/extension --save --registry https://npm.txiiot.cn

1
2
3
4
5
6
7
8

引用

// 引入three对象
import { Vector3 } from 'three';

// 引入three示例包中对象
import { LineSegments2 } from 'three/examples/jsm/lines/LineSegments2.js';

// 引用核心包中的对象
import { Engine, OrbitControl } from '@tx3d/core';

// 引用扩展包中的对象
import { TransformEditorTool } from '@tx3d/extension';

1
2
3
4
5
6
7
8
9
10
11

引擎 →