# Pyramid组件

使用Pyramid组件可以为实体添加3D"金字塔"(棱柱,棱锥),由 @tx3d/extension 包提供。

import { Pyramid, ChartCrossSectionType } from '@tx3d/extension';

// 创建实体
const entity = engine.createEntity();

// 添加Pyramid组件
const pyramid = entity.addComponent( Pyramid, {

    topSize: 0.0,
    bottomSize: 4.0,
    height: 0,
    type: ChartCrossSectionType.Square,
    material: {

        startColor: '#9bd72d',
        endColor: '#ffff00',
        // color: '#ffffff',
        opacity: 1.0,
        metalness: 0.0,
        roughness: 0.1,
        clearcoat: 1.0, 
        clearcoatRoughness: 0.1, 
        sheen: 1.0,
        transmission: 0.5

    },
    edge: { 

        color: '#9bd72d',
        visible: true,
        opacity: 1.0,
        width: 1.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

提示

Pyramid组件初始化参数,详见PyramidParameters

# 属性

🌏 height 高度设置

// 获取是"金字塔"高度
const height = pyramid.height;

// 设置"金字塔"高度
pyramid.height = 10;
1
2
3
4
5

🌏 occluded 是否可被遮挡设置

// 获取是否可被遮挡
const occluded = pyramid.occluded;

// 设置不可被遮挡
pyramid.occluded = false;
1
2
3
4
5

🌏 opacity 透明度

// 获取透明度
const opacity = pyramid.opacity;

// 设置透明度
pyramid.opacity = 0.75;
1
2
3
4
5

注意

opacity取值应在[ 0.0 ~ 1.0 ]区间

🌏 color 统一控制颜色设置,只写属性

// 设置颜色
pyramid.color = '#de98d3';
1
2

注意

初始化创建"金字塔"时,同时传递color参数和(startColor及endColor)参数时,后者参数设置不起作用,以color参数设置颜色为准,设置为统一颜色,如不想统一设置颜色,可不传递color参数

🌏 startColor 起始端颜色设置

// 获取起始端颜色
const startColor = pyramid.startColor;

// 设置起始端颜色
pyramid.startColor = '#ff0000';
1
2
3
4
5

🌏 endColor 末端颜色设置

// 获取末端颜色
const endColor = pyramid.endColor;

// 设置末端颜色
pyramid.endColor = '#00ffff';
1
2
3
4
5

🌏 edgeOpacity 边框线透明度

// 获取边框线透明度
const edgeOpacity = pyramid.edgeOpacity;

// 设置边框线透明度
pyramid.edgeOpacity = 0.90;
1
2
3
4
5

注意

edgeOpacity取值应在[ 0.0 ~ 1.0 ]区间

🌏 edgeColor 边框线颜色设置

// 获取边框线颜色
const edgeColor = pyramid.edgeColor;

// 设置边框线颜色
pyramid.edgeColor = '#ffffff';
1
2
3
4
5

🌏 edgeVisible 边框线可见性设置

// 获取边框线可见性
const edgeVisible = pyramid.edgeVisible;

// 设置边框线不可见
pyramid.edgeVisible = false;
1
2
3
4
5

🌏 edgeWidth 边框线宽度设置

// 获取边框线宽度
const edgeWidth = pyramid.edgeWidth;

// 设置边框线宽度
pyramid.edgeWidth = 2.0;
1
2
3
4
5
Last Updated: 12/21/2022, 3:17:21 PM