# 巷道

# 加载巷道

1️⃣ 使用引擎（Engine）的loadLaneways接口加载巷道。

// 加载巷道
engine.loadLaneways( 'assets/jsons/laneway.json', {

    // 巷道样式配置参数
    arrowMap: 'assets/textures/laneway/arrow.png',  // 外壁箭头纹理
    leftMap: 'assets/textures/laneway/left.jpg',    // 内壁左邦纹理
    rightMap: 'assets/texture/laneway/right.jpg',   // 内壁右邦纹理
    topMap: 'assets/texture/laneway/top.jpg',       // 内壁顶板纹理
    bottomMap: 'assets/texture/laneway/bottom.jpg'  // 内壁底板纹理

} ).then( ( result ) => {

    // 巷道实体
    const laneways = result.laneways;

    // 交叉口实体
    const crossings = result.crossings;

    // 巷道外包范围
    const bounds = result.bounds;

} );

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

提示

巷道样式配置参数，详见LanewayConfiguration。

2️⃣ 使用引擎（Engine）的loadLanewaysByData接口加载巷道。

// 通过数据加载巷道
const result = engine.loadLanewaysByData( data, {
    
    // 巷道样式配置参数
    materialScheme: 'gradient',                 // 巷道材质方案
    color: '#00dade',                           // 巷道外壁颜色
    bottomColor: '#06409c',                     // 巷道内壁底板颜色
    arrowVisible: true,                         // 是否显示外壁箭头
    arrowMap: './assets/textures/编组 16.png'   // 巷道外壁箭头纹理

} );

// 巷道实体
const laneways = result.laneways;

// 交叉口实体
const crossings = result.crossings;

// 巷道外包范围
const bounds = result.bounds;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20

# 巷道属性

提示

巷道使用Laneway组件渲染，更新属性或调用接口时需要先获取巷道渲染组件。

import { Laneway } from '@tx3d/core';

// 获取巷道渲染组件
const laneway = entity.getComponent( Laneway );

1
2
3
4

🌏 code 巷道编码，只读。

// 获取巷道编码
const code = laneway.code;

1
2

🌏 parent 巷道父编码，只读。

// 获取巷道父编码
const parent = laneway.parent;

1
2

🌏 name 巷道名称，只读。

// 获取巷道名称
const name = laneway.name;

1
2

🌏 material 巷道材质名称，只读。

// 获取巷道材质
const material = laneway.material;

1
2

🌏 materialScheme 巷道材质方案，只读。

// 获取巷道材质方案
const materialScheme = laneway.materialScheme;

1
2

🌏 vertical 是否是竖井，只读。

// 获取巷道是否是竖井
const vertical = laneway.vertical;

1
2

🌏 useLOD 是否启用LOD，只读。

// 获取巷道是否启用LOD
const useLOD = laneway.useLOD;

1
2

🌏 leadNodes 巷道导线点数据，只读。

// 获取巷道导线点数据
const leadNodes = laneway.leadNodes;

1
2

🌏 outerVisible 巷道外壁可见性控制，只写。

// 设置巷道外壁可见性
laneway.outerVisible = false;

1
2

🌏 innerVisible 巷道内壁可见性控制，只写。

// 设置巷道内壁可见性
laneway.innerVisible = false;

1
2

🌏 topVisible 巷道内外壁顶板可见性控制，只写。

// 设置巷道内外壁顶板可见性
laneway.topVisible = false

1
2

🌏 color 巷道外壁颜色，只写。

// 设置巷道外壁颜色
laneway.color = '#aa34dd';

1
2

提示

该属性会同时修改巷道起点和终点颜色。

🌏 startColor 巷道外壁起点颜色

// 获取巷道外壁起点颜色
const startColor = laneway.startColor;

// 设置巷道外壁起点颜色
laneway.startColor = '#ff34de';

1
2
3
4
5

🌏 endColor 巷道外壁终点颜色

// 获取巷道外壁终点颜色
const endColor = laneway.endColor;

// 设置巷道外壁终点颜色
laneway.endColor = '#ff34de';

1
2
3
4
5

🌏 bottomColor 巷道内壁底板颜色

// 获取巷道内壁底板颜色
const bottomColor = laneway.bottomColor;

// 设置巷道内壁底板颜色
laneway.bottomColor = '#ff34de';

1
2
3
4
5

注意

该属性为“Gradient”材质方案的特有属性。

🌏 arrowVisible 巷道外壁箭头可见性控制

// 获取巷道外壁箭头可见性
const arrowVisible = laneway.arrowVisible;

// 设置巷道外壁箭头可见性
laneway.arrowVisible = true;

1
2
3
4
5

提示

该属性会同时控制巷道外壁顶板、底板、左邦、右邦的箭头可见性。

🌏 topArrowVisible 巷道外壁顶板箭头可见性控制

// 获取巷道外壁顶板箭头可见性
const topArrowVisible = laneway.arrowVisible;

// 设置巷道外壁顶板箭头可见性
laneway.topArrowVisible = true;

1
2
3
4
5

🌏 bottomArrowVisible 巷道外壁底板箭头可见性控制

// 获取巷道外壁底板箭头可见性
const bottomArrowVisible = laneway.bottomArrowVisible;

// 设置巷道外壁底板箭头可见性
laneway.bottomArrowVisible = true;

1
2
3
4
5

🌏 leftArrowVisible 巷道外壁左邦箭头可见性控制

// 获取巷道外壁左邦箭头可见性
const leftArrowVisible = laneway.leftArrowVisible;

// 设置巷道外壁左邦箭头可见性
laneway.leftArrowVisible = true;

1
2
3
4
5

🌏 rightArrowVisible 巷道外壁右邦箭头可见性控制

// 获取巷道外壁右邦箭头可见性
const rightArrowVisible = laneway.rightArrowVisible;

// 设置巷道外壁右邦箭头可见性
laneway.rightArrowVisible = true;

1
2
3
4
5

🌏 arrowSpace 巷道外壁流动箭头间距

// 获取巷道外壁流动箭头间距
const arrowSpace = laneway.arrowSpace;

// 设置巷道外壁流动箭头间距
laneway.arrowSpace = 1.0;

1
2
3
4
5

🌏 flowSpeed 巷道外壁流动箭头流动速度

// 获取巷道外壁流动箭头间距
const flowSpeed = laneway.flowSpeed;

// 设置巷道外壁流动箭头间距
laneway.flowSpeed = 5.0;

1
2
3
4
5

🌏 flowDirection 巷道外壁箭头流动方向

// 获取巷道外壁箭头流动方向
const flowDirection = laneway.flowDirection;

// 设置巷道外壁箭头流动方向
laneway.flowDirection = -1.0;

1
2
3
4
5

注意

flowDirection取值为+1或-1，其中+1表示从起点流向终点，-1表示从终点流向起点。

🌏 length 巷道长度，只读。

// 获取巷道长度
const length = laneway.length;

1
2

🌏 startTopoID 巷道起点拓扑编码，只读。

// 获取巷道起点拓扑编码
const startTopoID = laneway.startTopoID;

1
2

🌏 endTopoID 巷道终点拓扑编码，只读。

// 获取巷道终点拓扑编码
const endTopoID = laneway.endTopoID;

1
2

🌏 startCrossing 巷道起点交叉口对象，只读。

// 获取巷道起点交叉口对象
const startCrossing = laneway.startCrossing;

1
2

🌏 endCrossing 巷道终点交叉口对象，只读。

// 获取巷道终点交叉口对象
const endCrossing = laneway.endCrossing;

1
2

🌏 topOcclusion 设置是否启用顶板遮挡，只写。

// 启用顶板遮挡
laneway.topOcclusion = true;

1
2

提示

该属性主要用于实现煤层开槽效果。

# 巷道接口

🌏 setHighlight 设置巷道是否高亮

// 高亮巷道
laneway.setHighlight( true, { color: '#ff0000', opacity: 0.5 } );

// 取消巷道高亮
laneway.setHighlight( false );

1
2
3
4
5

提示

高亮设置参数，详见HighlightParameters。

🌏 projectPoint 计算坐标点（世界坐标）在巷道中线的投影点坐标

import { defined } from '@tx3d/core';

// 计算投影点坐标
const project = laneway.projectPoint( [ 100.0, 500.0, 3000.0 ] );

// 判断是否投影到巷道上
if ( defined( project ) ) {

    // 投影点坐标
    const position = project.position;

    // 投影点所处巷道段起始导线点编号
    const startIndex = project.startIndex;

    // 投影点所处巷道段结束导线点编号
    const endIndex = project.endIndex;

}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

🌏 append 在巷道尾部追加一个或多个导线点

注意

如果巷道终点是交叉口则无法追加导线点！！！

// 在巷道尾部追加一个导线点
laneway.append( {

    height: 3.0,
    leftWidth: 2.0,
    leftWidth2: 2.0,
    rightWidth: 2.0,
    rightWidth: 2.0,
    useSecond: false,
    position: {

        100.0,
        0.0,
        100.0

    }

} );

// 在巷道尾部追加多个导线点
laneway.append( [ {

    height: 3.0,
    leftWidth: 2.0,
    leftWidth2: 2.0,
    rightWidth: 2.0,
    rightWidth: 2.0,
    useSecond: false,
    position: {

        10.0,
        0.0,
        10.0

    }

}, {

    height: 3.0,
    leftWidth: 2.0,
    leftWidth2: 2.0,
    rightWidth: 2.0,
    rightWidth: 2.0,
    useSecond: false,
    position: {

        50.0,
        0.0,
        50.0

    }

} ] );

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

提示

导线点结构详见LeadNode，其中导线点位置（position）为GIS坐标，可以通过以下方法将地测坐标转换为GIS坐标：

// 地测坐标
const geodeticCoord = {

    X: 37400768.0186045,
    Y: 4418930.775504871,
    Z: 1123.135571512249

}

// 地测坐标转GIS坐标
const position = this.engine.crsManager.geodetic3ToMercator3( geodeticCoord.X, geodeticCoord.Y, geodeticCoord.Z );

// 坐标轴变换（GIS坐标系Y = 地测坐标系Z，GIS坐标系Z = 地测坐标系-Y）
const temp = position.y;
position.y = position.z;
position.z = -temp;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16

🌏 unshift 在巷道头部添加一个或多个导线点

注意

如果巷道起点是交叉口则无法添加导线点！！！

// 在巷道头部添加一个导线点
laneway.unshift( {

    height: 3.0,
    leftWidth: 2.0,
    leftWidth2: 2.0,
    rightWidth: 2.0,
    rightWidth: 2.0,
    useSecond: false,
    position: {

        100.0,
        0.0,
        100.0

    }

} );

// 在巷道头部添加多个导线点
laneway.unshift( [ {

    height: 3.0,
    leftWidth: 2.0,
    leftWidth2: 2.0,
    rightWidth: 2.0,
    rightWidth: 2.0,
    useSecond: false,
    position: {

        10.0,
        0.0,
        10.0

    }

}, {

    height: 3.0,
    leftWidth: 2.0,
    leftWidth2: 2.0,
    rightWidth: 2.0,
    rightWidth: 2.0,
    useSecond: false,
    position: {

        50.0,
        0.0,
        50.0

    }

} ] );

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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

🌏 pop 移除巷道尾部导线点

// 移除巷道尾部导线点
laneway.pop();

1
2

🌏 shift 移除巷道头部导线点

// 移除巷道头部导线点
laneway.shift();

1
2

注意

如果移除头部或尾部导线点后，巷道只剩一个导线点，则会自动释放巷道的渲染数据。注意，此时只是释放渲染数据并未销毁巷道渲染组件，可以通过append或unshift添加导线点重新绘制巷道，如果想彻底销毁巷道渲染组件可以通过以下两种方法实现：

import { Laneway } from '@tx3d/core';

// 方法1：从实体上移除巷道渲染组件
entity.removeComponent( Laneway );

// 方法2：直接销毁实体
entity.destroy();

1
2
3
4
5
6
7

🌏 translate 沿指定方向平移巷道导线点

// 沿[ 10.0, 20.0, 3.0 ]方向平移巷道索引编号为1的导线点
laneway.translate( 1, [ 10.0, 20.0, 30.0 ] );

1
2

注意

该方法无法平移交叉口处导线点，使用交叉口（LanewayCrossing）的translate方法代替。

🌏 translateTo 平移巷道导线点到指定位置

// 平移巷道索引编号为1的导线点到[ 100.0, 0.0, 350.0 ]处
laneway.translateTo( 1, [ 100.0, 0.0, 350.0 ] );

1
2

注意

该方法无法平移交叉口处导线点，使用交叉口（LanewayCrossing）的translateTo方法代替。

# 交叉口属性

提示

交叉口使用LanewayCrossing组件渲染，更新属性或调用接口时需要先获取交叉口渲染组件。

import { LanewayCrossing } from '@tx3d/core';

// 获取交叉口渲染组件
const crossing = entity.getComponent( LanewayCrossing );

1
2
3
4

🌏 topoID 交叉口拓扑ID，只读。

// 获取交叉口拓扑ID
const topoID = crossing.topoID;

1
2

🌏 material 交叉口材质名称，只读。

// 获取交叉口材质名称
const material = crossing.material;

1
2

🌏 materialScheme 交叉口材质方案，只读。

// 获取交叉口材质方案
const materialScheme = crossing.materialScheme;

1
2

🌏 centerPosition 交叉口中心点位置（大坐标），只读。

// 获取交叉口位置
const centerPosition = crossing.centerPosition;

1
2

🌏 relativeCenterPosition 交叉口中心点相对位置（世界坐标），只读。

// 获取交叉口相对位置
const relativeCenterPosition = crossing.relativeCenterPosition;

1
2

🌏 useLOD 交叉口是否启用LOD，只读。

// 获取交叉口是否启用LOD
const useLOD = crossing.useLOD;

1
2

🌏 outerVisible 交叉口外壁可见性控制，只写。

// 设置交叉口外壁可见性
crossing.outerVisible = false;

1
2

🌏 innerVisible 交叉口内壁可见性控制，只写。

// 设置交叉口内壁可见性
crossing.innerVisible = false;

1
2

🌏 topVisible 交叉口内外壁顶板可见性控制，只写。

// 设置交叉口内外壁可见性
crossing.topVisible = false;

1
2

🌏 color 交叉口外壁颜色

// 获取交叉口外壁颜色
const color = crossing.color;

// 设置交叉口外壁颜色
crossing.color = '#ffdd56';

1
2
3
4
5

🌏 bottomColor 交叉口内壁底板颜色

// 获取交叉口内壁底板颜色
const bottomColor = crossing.bottomColor;

// 设置交叉口内壁底板颜色
crossing.bottomColor = '#ff00de';

1
2
3
4
5

注意

该属性为“Gradient”材质方案的特有属性。

🌏 branchCount 交叉口连接分支数目，只读。

// 获取交叉口连接分支数目
const count = crossing.branchCount();

1
2

🌏 topOcclusion 设置是否启用顶板遮挡，只写。

// 启用顶板遮挡
crossing.topOcclusion = true;

1
2

提示

该属性主要用于实现煤层开槽效果。

# 交叉口接口

🌏 getBranch 获取指定索引分支

// 获取指定索引分支
const branch = crossing.getBranch( 1 );

1
2

🌏 lookupBranch 查找分支

// 查找编码为"xxxx-xxxx"巷道所属分支
const branch = crossing.lookupBranch( 'xxxx-xxxx' );

1
2

🌏 setHighlight 设置交叉口是否高亮

// 高亮交叉口
crossing.setHighlight( true, { color: '#ff0000', opacity: 0.5 } );

// 取消交叉口高亮
crossing.setHighlight( false );

1
2
3
4
5

提示

高亮设置参数，详见HighlightParameters。

🌏 connect 将巷道连接到交叉口

// 将巷道连接到交叉口
crossing.connect( laneway );

1
2

注意

导线点个数小于等于1的巷道无法连接到交叉口！！！

🌏 disconnect 从交叉口上断开指定巷道

// 断开指定巷道
crossing.disconnect( laneway );

1
2

🌏 disconnectAll 断开交叉口上的所有巷道

// 断开交叉口上的所有巷道
crossing.disconnectAll();

1
2

注意

如果断开巷道后交叉口只剩一个巷道分支或断开交叉口上的所有巷道，会自动释放交叉口的渲染数据。注意，此时只是释放渲染数据并未销毁交叉口渲染组件，可以通过connect连接巷道重新绘制交叉口，如果想彻底销毁交叉口渲染组件可以通过以下两种方法实现：

import { LanewayCrossing } from '@tx3d/core';

// 方法1：从实体上移除交叉口渲染组件
entity.removeComponent( LanewayCrossing );

// 方法2：直接销毁实体
entity.destroy();

1
2
3
4
5
6
7

🌏 translate 沿指定方向平移交叉口

// 沿[ 10.0, 50.0, 3.0 ]方向平移交叉口
crossing.translate( [ 10.0, 50.0, 3.0 ] );

1
2

🌏 translateTo 平移交叉口到指定位置

// 平移交叉口到[ 30.0, 55.0, 100.0 ]处
crossing.translateTo( [ 30.0, 55.0, 100.0 ] );

1
2

← MeshLine 管线 →