将新模型动态添加到查看器中

问题描述

我想创建一个网页，其中左侧将显示模型缩略图，而在右侧，我需要显示所述模型。我找到了最初加载多个模型的解决方案，如下所示：

    window.addEventListener('DOMContentLoaded',() =>
        loadModels([
            { urn: "urn1",xform: { x: -60,y: 0,z: 0 } },{ urn: "urn2",xform: { x: 60,{ urn: "urn3",xform: { x: 50,z: 50 } },])
    );

并使用以下函数

       Autodesk.Viewing.Initializer(viewerOptions,() => {

            const div = document.getElementById('forgeViewer');
            viewer = new Autodesk.Viewing.Private.GuiViewer3D(div,{ extensions: ["DragControlExtension"] });
            viewer.start();
            urns.map((m) => {
                Autodesk.Viewing.Document.load(`urn:${m.urn}`,(doc) => {
                    var viewables = doc.getRoot().getDefaultGeometry();
                    viewer.loadDocumentNode(doc,viewables,{
                        placementTransform: (new THREE.Matrix4()).setPosition(m.xform),keepCurrentModels: true,globalOffset: { x: 0,z: 0 }
                    })
                        .then(onLoadFinished);
                });

            })
        });

现在，我的问题是：“我可以在运行时拖动新模型吗”。另外，是否可以通过拖动来移动现有模型。

在 Autodesk.Viewing.Initializer 之后，是否有任何事件或方法可能会有所帮助？ （一些参考也会有所帮助。）

解决方法

加载模型后，您可以通过修改其 placementTransform 来移动它 - 例如如果 secondModel 是您刚刚添加的并且正在尝试移动，例如键盘上的键，你可以这样做：

document.onkeydown = event => {
  if (!event.shiftKey)
    return;

  if (event.code === "ArrowRight") {
    let tr = secondModel.getPlacementTransform();
    // move along X axis
    tr.elements[12] += 1;
    secondModel.setPlacementTransform(tr);
  }

  if (event.code === "ArrowLeft") {
    let tr = secondModel.getPlacementTransform();
    // move along X axis
    tr.elements[12] -= 1;
    secondModel.setPlacementTransform(tr);
  }
};  

您可以在此处找到有关它的更多详细信息：https://forge.autodesk.com/blog/dynamic-model-placement