停靠面板可调整大小和滚动容器

Question

如何使停靠面板可调整大小？如何在停靠面板中创建滚动容器？

我已经使用此答案中给出的简单面板扩展了停靠面板。所以理想的是知道如何在

中制作它们

SimplePanel.prototype.initialize = function()

或创建对接面板时的某处。

Answer 1

我更喜欢扩展机制，这样您就可以定义 JavaScript 文件 self-contain 它。这是一个例子。现在 style.resize="auto" 代码行以及如何 appendChild 与其他元素（例如 DIV充满其他元素）。使用此扩展程序，您只需调用 viewer.loadExtension().

AutodeskNamespace('Autodesk.ADN.Viewing.Extension');

Autodesk.ADN.Viewing.Extension.MyExtension = function (viewer, options) {
  Autodesk.Viewing.Extension.call(this, viewer, options);

  var _self = this;

  ///////////////////////////////////////////////////////////////////////////
  // load callback
  ///////////////////////////////////////////////////////////////////////////
  _self.load = function () {

    // need to access geometry? wait until is loaded
    viewer.addEventListener(Autodesk.Viewing.GEOMETRY_LOADED_EVENT, function () {
      createDockPanel();
    });

    return true;
  };

  var _dockPanel;

  function createDockPanel() {
    _dockPanel = new Autodesk.Viewing.UI.DockingPanel(viewer.container, 'ecom', 'Cart');

    _dockPanel.container.style.top = "10px";
    _dockPanel.container.style.left = "10px";

    _dockPanel.container.style.width = "auto";
    _dockPanel.container.style.height = "auto";
    _dockPanel.container.style.resize = "auto";

    _dockPanel.container.appendChild(document.getElementById(‘someOtherElement’)); // for instance, a DIV

    _dockPanel.setVisible(true);
  }


  ///////////////////////////////////////////////////////////////////////////
  // unload callback
  ///////////////////////////////////////////////////////////////////////////
  _self.unload = function () {
    _dockPanel.setVisible(false)
    return true;
  };
};

Autodesk.ADN.Viewing.Extension.MyExtension.prototype = Object.create(Autodesk.Viewing.Extension.prototype);

Autodesk.ADN.Viewing.Extension.MyExtension.prototype.constructor = Autodesk.ADN.Viewing.Extension.MyExtension;

Autodesk.Viewing.theExtensionManager.registerExtension('Autodesk.ADN.Viewing.Extension.MyExtension', Autodesk.ADN.Viewing.Extension.MyExtension);

停靠面板可调整大小和滚动容器

Docking Panel resizable and scroll container

autodesk-viewer

autodesk-forge