如何删除 Autodesk Forge Viewer 版本 7 中的工具栏按钮

Question

我正在尝试删除 Autodesk Forge Viewer 新版本 7 中的工具栏按钮。

请参考我的以下代码：

 viewer.addEventListener(Autodesk.Viewing.TOOLBAR_CREATED_EVENT, (e) => {
        console.log(e);
        let modelTools = e.target.toolbar.getControl('modelTools')
        console.log(modelTools);
        modelTools.removeControl('toolbar-explodeTool');
        modelTools.removeControl('toolbar-measurementSubmenuTool');
        modelTools.removeControl('toolbar-modelStructureTool');
    })

从几个快速的 StackOverflow 搜索中，我能够理解我必须监听一个事件，然后控制扩展并将其删除，我想我正在尝试做同样的事情，但它没有产生任何结果，按钮不不会被移除。

请帮忙！

Answer 1

最简单的方法是使用如下样式覆盖来隐藏它们（请参阅此处的现场演示）：

.adsk-viewing-viewer #toolbar-modelStructureTool{display:none!important}
.adsk-viewing-viewer #toolbar-explodeTool{display:none!important}
.adsk-viewing-viewer #toolbar-measurementSubmenuTool{display:none!important}

另一种解决方法是抑制这些默认的内置扩展的自动加载，并在稍后使用回调加载它们以隐藏它们的控件，因为我们确信在触发回调时工具栏将由它们的控件填充：

 new Autodesk.Viewing.Private.GuiViewer3D(document.getElementById('MyViewerDiv'),{disabledExtensions
:{measure:true,explode:true}})

//...

viewer.loadExtension('Autodesk.Explode', viewer.config).then(ext=>{
//...hide the controls
});

viewer.loadExtension('Autodesk.Measure', viewer.config).then(ext=>{
//...hide the controls
});

Answer 2

另一种方法如下：

// Viewer instance is `viewer`
const toolbarControls = [];
if (var i = 0; i < viewer.toolbar.getNumberOfControls(); i++) {
  toolbarControls.push(viewer.toolbar.getControlId(i));
}

// E.g., remove all controls
toolbarControls.forEach(control => viewer.toolbar.removeControl(control));

Answer 3

如果您使用的是最近发布的查看器版本 - v7 - 请注意，现在应该使用回调方法而不是订阅事件来拦截工具栏的创建。 有关更多详细信息，请参阅迁移指南。

如果您还没有准备好迁移到 v7，您可以在脚本标签中对 v6 进行硬编码，例如<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/viewer3D.min.js?v=v6.*"></script> 。

Answer 4

请尝试 ：

(viewer.toolbar.getControl("modelTools") as Autodesk.Viewing.UI.ControlGroup).removeControl('toolbar-explodeTool');

Answer 5

标准工具栏上的按钮与加载的扩展程序相关联。 如果您删除/隐藏按钮，您可以使用相关的扩展有效地禁用。 我建议卸载扩展而不是删除按钮。 在使用NOP_VIEWER对象以交互方式在浏览器的调试窗口中编写代码之前，您可以尝试对该行为进行NOP_VIEWER 。 试试这个序列：

NOP_VIEWER.getLoadedExtensions()
NOP_VIEWER.unloadExtension('Autodesk.ModelStructure')

您应该注意到，一旦卸载扩展程序，相应的按钮也会从工具栏中消失。 现在您需要选择卸载扩展程序的时间。 我建议您在 viewer.start 调用的onSuccessCallback函数中执行此操作，因为这是在加载扩展时如下所示：

this.viewer.start(null, () => {
      console.log('Forge viewer started');
      this.viewer.unloadExtension('Autodesk.ModelStructure');
    }, (errorCode, errorMessage) => {
      console.error(`Forge viewer start error ${errorCode}`, errorMessage);
    });

卸载扩展方法更好的原因是因为每个扩展都在卸载时实现了一个清理逻辑，该逻辑应该删除它在加载时创建的 UI 元素。 在此处查看更多信息https://forge.autodesk.com/en/docs/viewer/v7/developers_guide/viewer_basics/toolbar-button/#step-3-cleanup https://forge.autodesk.com/en/docs/viewer /v7/reference/Viewing/Viewer3D/#start-url-options-onsuccesscallback-onerrorcallback-initoptions