Skip to content

viewer.navcube — NavCubeManager

设计意图

viewer.navcube 是导航立方体域,管引擎内建的 WebGL NavCube:画布角落那个随相机姿态实时旋转的小立方,点它的面 / 棱 / 角切到对应视角。公开面只有五个方法:setEnabled(开关渲染与交互)、setAnchor(停靠到画布四角之一)、setSize(视口边长,CSS 像素)、goHome(动画回默认等轴测主视角)与查询 isEnabled()

初始状态由构造期 ViewerOptions.navCube 决定:enabled 默认 trueanchor 默认 "top-right"size 默认 185。它与 viewer-ui 的 <fmb-view-cube> 组件是二选一的关系:内建 NavCube 是 WebGL 绘制、随相机旋转的姿态指示器;<fmb-view-cube> 是纯 CSS 的静态视图切换按钮组。改用后者时创建引擎传 navCube: { enabled: false },避免右上角重叠。

何时用它:运行时开关 / 挪角落 / 调大小(如给覆盖在画布上的自家 UI 让位)、工具条的「回主视角」按钮。程序化切标准视图("front" / "iso" 等)归 viewer.camerasetStandardView

典型用法

给右上角的自家面板让位(挪到左下 + 缩小):

ts
viewer.navcube.setAnchor("bottom-left");
viewer.navcube.setSize(120); // CSS 像素,默认 185

工具条「回主视角」按钮(动画回默认等轴测):

ts
homeBtn.onclick = () => viewer.navcube.goHome();

运行时整体开关(如进入无干扰的截图模式):

ts
const wasOn = viewer.navcube.isEnabled();
viewer.navcube.setEnabled(false);
// ……截图完毕恢复
viewer.navcube.setEnabled(wasOn);

注意事项

  • <fmb-view-cube> 二选一:两者默认都停靠右上角,同时开会重叠;选内建得到「随相机旋转的姿态指示器」,选组件得到「纯 CSS 静态切换按钮」,取舍见 fmb-view-cube
  • setSize 单位是 CSS 像素(视口边长),内部自动乘设备像素比,高分屏不需要自己换算。
  • goHome 回的是引擎默认等轴测主视角,不是 ViewerOptions.initialCamera 给的初始位姿;要回自定义初始位姿用 viewer.camera.setState 存取快照。
  • 所有方法在 viewer 销毁后抛 ViewerError(Disposed),包括查询 isEnabled()

完整签名与延伸