Question

我找到了这个示例（https://forge.autodesk.com/blog/3d-markup-icons-and-info-card）在链接中找到的代码工作正常，但我想在Forge的专用存储桶中使用文件/模型

1）我想知道是否有办法访问上传到在伪造平台上创建的专用存储桶的文件？如果是这样，是否可以像本例一样以https://lmv-models.s3.amazonaws.com/toy_plane/toy_plane.svf的形式访问此文件？

2）我编辑了现有代码以绕过存储桶，并将我的onw模型加载到伪造查看器中并添加标记（令牌和urn起作用）

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="https://developer.api.autodesk.com/modelderivative/v2/viewers/style.min.css?v=3.3" type="text/css">
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/three.min.js?v=v3.3"></script>
<script src="https://developer.api.autodesk.com/modelderivative/v2/viewers/viewer3D.min.js?v=v3.3"></script>
<div id="forgeViewer"></div>
<!--3D markup-->
<script src="markupExt.js"></script>
</head>
<body>
<script>
var $ = function (div) {
return document.getElementById(div)
}

var options = {
   env: 'AutodeskProduction',
   accessToken: '$TOKEN'
};

var documentId = 'urn:URN';
Autodesk.Viewing.Initializer(options, onInitialized);

function onInitialized() {
window.devicePixelRatio = 1
viewer = new Autodesk.Viewing.ViewingApplication('MyViewerDiv');
const config3D = {
    'extensions': ['markup3d']
}
viewer.registerViewer(viewer.k3D, Autodesk.Viewing.Viewer3D, config3D);
model = viewer.loadDocument(documentId, onDocumentLoaded);
//viewer.loadExtension("markup3d");


function onDocumentLoaded() {
    var modelNodes = viewer.bubble.search(av.BubbleNode.MODEL_NODE); // 3D designs
    var sheetNodes = viewer.bubble.search(av.BubbleNode.SHEET_NODE); // 2D designs
    var allNodes = modelNodes.concat(sheetNodes);
    if (allNodes.length) {
        viewer.selectItem(allNodes[0].data);
        if (allNodes.length === 1) {
            alert('This tutorial works best with documents with more than one viewable!');
        }
    } else {
        alert('There are no viewables for the provided URN!');

    }
    onSuccess()
}

function onSuccess() {
    initializeMarkup();
}
}
///////////markup/////////////////

var elem = $("label");

function initializeMarkup() {
// plaatsing van een punt
var dummyData = [];
for (let i = 0; i < 20; i++) {
    dummyData.push({
        icon: 0,
        x: Math.round(200),
        y: Math.round(190),
        z: Math.round(50)
    });
}


window.dispatchEvent(new CustomEvent('newData', {
    'detail': dummyData
}));
}
window.addEventListener("onMarkupClick", e => {
//elem.style.display = elem.style.display == 'block' ? "block" : "none";
elem.style.display = "block";
moveLabel(e.detail);
console.log(e.detail.id)
if (e.detail.id == 20) {
    elem.innerHTML = `<img src="sen.jpg"><br>Sensor ` + e.detail.id;
})
window.addEventListener("onMarkupMove", e => {
moveLabel(e.detail)
}, false)

function moveLabel(p) {
elem.style.left = ((p.x + 1) / 2 * window.innerWidth) + 'px';
elem.style.top = (-(p.y - 1) / 2 * window.innerHeight) + 'px';
}
</script>
</body>

已加载模型，但未显示标记。（markupExt.js是在示例链接上找到的代码）

Answer 1

在粘贴代码段时可能遗漏了一些东西。该示例的资源代码位于此处（https://github.com/wallabyway/markupExt），您可以在该博客的底部找到链接。

下载后，您已经设置了一个Web服务器来托管该项目，并在我们的浏览器中导航至http://YOUR_WEB_SITE_OF_THAT_PROJECT/docs。您会看到飞机和标记已加载，没有任何问题。刚在我的机器上测试过〜

====关于Micheal的评论的更新：

由于飞机和Revit模型中使用的查看器的长度单位不同，因此无法直接使用markup3d扩展名，而无需进行任何修改。

我在here中的示例rac_basic_sample_project.rvt上使用了以下代码段。 dbIds是sun模块面板，标记点的位置是sun模块边界框的中点。

const dbIds = [ 3873, 3903, 3909, 3910, 3912, 3913, 3918, 3919, 3924, 3925, 3930, 3931 ];
const model = event.model;
const instanceTree = model.getData().instanceTree;
const globalOffset = model.getData().globalOffset;
const fragList = model.getFragmentList();
const dummyData = [];

for( let i=0; i<dbIds.length; i++ ) {
    const dbId = dbIds[i];
    let bounds = new THREE.Box3();
    let box = new THREE.Box3();

    instanceTree.enumNodeFragments( dbId, ( fragId ) => {
        fragList.getWorldBounds( fragId, box );
        bounds.union( box );
    }, true );

    const worldPoint = new THREE.Vector3(
        ( bounds.max.x + bounds.min.x ) / 2 + globalOffset.x,
        ( bounds.max.y + bounds.min.y ) / 2 + globalOffset.y,
        ( bounds.max.z + bounds.min.z ) / 2 + globalOffset.z + 0.5
    );

    console.log( worldPoint );


    dummyData.push({
        icon:  Math.round(Math.random()*3),  
        x: worldPoint.x, 
        y: worldPoint.y, 
        z: worldPoint.z
    });
}

window.dispatchEvent(new CustomEvent('newData', {'detail': dummyData}));

结果如下：

如果您对该扩展名还有其他疑问，我建议您直接与作者讨论：https://github.com/wallabyway/markupExt/issues

在伪造查看器上的3d标记

1 个答案: