# 矢量面
# 创建矢量面
使用引擎(Engine)的createPolygon接口创建矢量面。
// 创建矢量面
const entity = engine.createPolygon( {
opacity: 1.0,
color: '#b9f985',
outlineWidth: 4.0,
outlineOpacity: 1.0,
outlineColor: '#d3c5c5',
coordinates: [
[
[ 100, 1, 0 ],
[ -100, 1, 0 ],
[ -100, 1, -100 ],
[ 100, 1, -100 ]
],
[
[ 75, 1, -25 ],
[ 25, 1, -25 ],
[ 25, 1, -75 ],
[ 75, 1, -75 ]
],
[
[ -50, 1, -25 ],
[ -25, 1, -75 ],
[ -75, 1, -75 ]
]
]
} );
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
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
提示
矢量面创建参数,详见PolygonParameters。
# 矢量面属性
提示
矢量面使用Polygon组件渲染,更新属性或调用接口时需要先获取矢量面渲染组件。
import { Polygon } from '@tx3d/core';
// 获取矢量面渲染组件
const polygon = entity.getComponent( Polygon );
1
2
3
4
2
3
4
🌏 color 颜色
// 获取矢量面颜色
const color = polygon.color;
// 设置矢量面颜色
polygon.color = '#ff00de';
1
2
3
4
5
2
3
4
5
🌏 outline 描边可见性
// 获取矢量面描边可见性
const outline = polygon.outline;
// 设置矢量面描边可见性
polygon.outline = true;
1
2
3
4
5
2
3
4
5
🌏 outlineWidth 描边宽度
// 获取矢量面描边宽度
const outlineWidth = polygon.outlineWidth;
// 设置矢量面描边宽度
polygon.outlineWidth = 2.0;
1
2
3
4
5
2
3
4
5
🌏 outlineColor 描边颜色
// 获取矢量面描边颜色
const outlineColor = polygon.outlineColor;
// 设置矢量面描边颜色
polygon.outlineColor = '#00ff00';
1
2
3
4
5
2
3
4
5
🌏 outlineOpacity 描边透明度
// 获取矢量面描边透明度
const outlineColor = polygon.outlineOpacity;
// 设置矢量面描边透明度
polygon.outlineOpacity = 0.75;
1
2
3
4
5
2
3
4
5
🌏 opacity 透明度
// 获取矢量面透明度
const opacity = polygon.opacity;
// 设置矢量面透明度
polygon.opacity = 0.75;
1
2
3
4
5
2
3
4
5
🌏 area 面积,只读。
// 获取矢量面面积
const area = polygon.area;
1
2
2
# 矢量面接口
🌏 updateCoordinates 更新矢量面坐标
// 更新矢量面板坐标
polygon.updateCoordinates( [
[ 100.0, 0.0, 100.0 ],
[ 100.0, 0.0, -100.0 ],
[ -100.0, 0.0, -100.0 ],
[ -100.0, 0.0, 100.0 ]
] );
1
2
3
4
5
6
7
8
9
2
3
4
5
6
7
8
9