Skip to content

TransformPanel 变形信息框 ​

说明

用于快速构建一个三维的信息面板,该面板与ZoomPanel的区别在于,它不仅会跟着视角的缩放而缩放,还会跟着摄像机的方向进行旋转

安装 ​

sh
npm install @poggi/three-entity
pnpm add @poggi/three-entity
yarn add @poggi/three-entity

基础用法 ​

通过使用usePanelTemplateDOM构建一个信息框专用的DOM节点,之后将节点挂载到面板中,即可构建出一个信息面板

案例中还使用了usePanelLine,构建一条连接线,线条默认将父级与面板进行连接可以清晰的表达出,该面板是谁的信息。你也可以手动传入两个连接点位,构建特定的连线

loading

与现代框架组件集成 ​

你可以将usePanelTemplateDOM构建的DOM,交给现代框架进行托管,使其具备更多的功能

loading

API ​

Attributes ​

属性名说明类型
scaleRatio缩放比例number
initShow是否初始显示boolean
switchVisible切换园区时面板的显示状态(默认为initShow)boolean

Methods ​

constructor(panelData: IPanelData)

构造函数

Interfaces ​

IPanelData

属性名说明类型是否必选默认值
element渲染DOMHTMLElement是-
initShow是否初始显示booleantrue
scaleRatio缩放比例number0.02