Forge Viewer：Autodesk.BoxSelection 扩展错误

问题描述

在我工作的项目（React、TS）中，我们使用查看器并为其添加了框选择扩展。

第一次使用工具栏中的按钮激活它时，扩展工作，元素被突出显示。然后您可以切换到另一种模式，例如轨道模式。之后，当您单击激活“框选择扩展”的按钮时，该扩展将不再起作用。轨道模式仍然有效。

同时，按钮被点击（console.log() 被触发）并且 loadExtension('Autodesk.Box Selection') 方法起作用。

可能是什么问题？

我会给出一些代码片段

这是扩展代码：

export default function RectangleSelectionExtension(
  this,viewer,options,) {
  window.Autodesk.Viewing.Extension.call(this,options);
}
RectangleSelectionExtension.prototype = (
  Object.create(window.Autodesk.Viewing.Extension.prototype)
);

RectangleSelectionExtension.prototype.constructor = RectangleSelectionExtension;
RectangleSelectionExtension.prototype.load = () => true;
RectangleSelectionExtension.prototype.unload = () => true;
RectangleSelectionExtension.prototype.onToolbarCreated = function onToolbarCreated() {
  this.group = this.viewer.toolbar.getControl('allExtensionsToolbar');
  if (!this.group) {
    this.group = new window.Autodesk.Viewing.UI.ControlGroup('allExtensionsToolbar');
    this.viewer.toolbar.addControl(this.group);
  }
  // Add a new button to the toolbar group
  this.button = new window.Autodesk.Viewing.UI.Button('RectangleSelectionExtension');
  this.button.onClick = async () => {
    const BoxSelectionExtension = await this.viewer.loadExtension('Autodesk.BoxSelection');
    this.viewer.toolController.activatetool(BoxSelectionExtension.BoxSelectionTool.getName());
    BoxSelectionExtension.addToolbarButton(this.viewer);
  };
  this.button.setToolTip('Select within a rectangle area');
  this.button.addClass('RectangleSelectionExtension');
  this.group.addControl(this.button);
};
window.Autodesk.Viewing.theExtensionManager.registerExtension('BoxSelection',RectangleSelectionExtension);

接下来，在查看器组件中，我们导入并注册扩展：

window.Autodesk.Viewing.theExtensionManager.registerExtension('RectangleSelectionExtension',RectangleSelectionExtension);

这就是我们初始化查看器的方式：

  window.Autodesk.Viewing.Initializer(options,() => {
    const container = document.getElementById('forgeViewer');
    if (container) {
      viewer = new window.Autodesk.Viewing.GuiViewer3D(
        container,{
          token,extensions: [
            /* ...some extensions */
            'RectangleSelectionExtension',],},);
      const startedCode = viewer.start();
      if (startedCode > 0) {
        return;
      }
      /* ...some eventListeners */
   }

解决方法

我不确定我是否理解您的 RectangleSelectionExtension 的目的。从代码看来，它只是在工具栏中添加了一个按钮，然后单击该按钮重复加载另一个扩展程序（Autodesk.BoxSelection），重复激活框选择工具，并重复将框选择按钮添加到工具栏中。这似乎不对。

如果您只是对框选择感兴趣，您可以像这样加载它（并将其包含在工具栏中）：

// ...

viewer = new window.Autodesk.Viewing.GuiViewer3D(
    container,{
        token,extensions: [
            /* ...some extensions */
            'Autodesk.BoxSelection',]
    }
);

// and later ...

const boxSelectionExt = viewer.getExtension('Autodesk.BoxSelection');
boxSelectionExt.addToolbarButton(true); // Add the button to the toolbar
boxSelectionExt.addToolbarButton(false); // Remove the button from the toolbar

// ...