deep-engine-demo/packages/docs/api/mesh/SpritePanel.md

outline
2 3

SpritePanel

• 源文件：packages/sdk/src/mesh/SpritePanel.ts
• 文档位置：packages/docs/api/mesh/SpritePanel.md

接口：SpritePanelOptions

• 作用：SpritePanelOptions 的结构定义。

字段

字段名	类型	必填	作用
text	string	是	用于保存 text 对应的数据。
textColor	string	否	用于保存 textColor 对应的数据。
backgroundColor	string	否	用于保存 backgroundColor 对应的数据。
borderColor	string	否	用于保存 borderColor 对应的数据。
borderWidth	number	否	用于保存 borderWidth 对应的数据。
fontSize	number	否	用于保存 fontSize 对应的数据。
padding	number	否	用于保存 padding 对应的数据。
sizeAttenuation	boolean	否	用于标记 sizeAttenuation 的启用状态。

类：SpritePanel

• 作用：精灵面板类 - 显示带背景和边框的文字面板
• 继承/实现：extends THREE.Sprite

构造函数

new SpritePanel(options: SpritePanelOptions)

• 作用：创建 SpritePanel 实例。

• 入参：

参数名	类型	必填	说明
options	SpritePanelOptions	是	当前功能对应的配置项。

• 出参：SpritePanel
• 返回说明：返回当前类实例。

属性

属性名	可见性	类型	作用
canvas	public	HTMLCanvasElement	用于保存 canvas 对应的数据。
context	public	CanvasRenderingContext2D	用于保存 context 对应的数据。
options	public	Required<SpritePanelOptions>	用于保存 options 对应的数据。

方法

setText(text: string): void

• 作用：设置 Text。

• 入参：

参数名	类型	必填	说明
text	string	是	参数 text，类型为 string。

• 出参：void
• 返回说明：无返回值。

dispose(): void

• 作用：释放资源并销毁当前实例。

• 入参：无

• 出参：void

• 返回说明：无返回值。

updateTexture(): void

• 作用：更新 Texture。

• 入参：无

• 出参：void

• 返回说明：无返回值。

构造示例

• 来源：packages/demo/src/disasterFormationPanel/GoldMineScene/HeatDisasterLabelPanel.vue

  const viewer = bus.getViewer();

  label = new SpritePanel({
    text: '热害',
    textColor: '#ffffff',
    backgroundColor: '#ff4444',
    borderColor: '#cc0000',
    borderWidth: 4
  });

函数示例

• 当前 Demo 中没有直接展示 SpritePanel 的公开方法调用。

Demo 参考

SpritePanel

以下示例文件中可以看到该 API 的实际调用方式：

• packages/demo/src/disasterFormationPanel/GoldMineScene/HeatDisasterLabelPanel.vue