A DEv
A DEv

Reputation: 340

forge viewer - how to show object tree / components tree along with viewer?

How we can show object tree / components tree along with viewer? So that user can click on the tree node and then he can see the object/dbid selected in viewer?

Any thoughts on this?

Upvotes: 0

Views: 1345

Answers (1)

Xiaodong Liang
Xiaodong Liang

Reputation: 2196

So, you wanted to build a similar model tree aside by Forge Viewer. The demo you shared is using JStree library to list the files in BIM 360. I believe you are familiar with JsTree.

To dump the model tree nodes of Forge Viewer, the code below could be a reference. It enumerates the hierarchy and gets the nodes name and dbId one by one.

function getAllLeafComponents(viewer, callback) {
    var cbCount = 0;
    var tree;
    var jsData = []

    function getLeafComponentsRec(current, parent) {
        cbCount++;
        if (tree.getChildCount(current) != 0) {
            tree.enumNodeChildren(current, function (children) {
                getLeafComponentsRec(children, current);
            }, false);
        }
        var nodeName = viewer.model.getInstanceTree().getNodeName(current)
        jsData.push({ id: current, parent: parent, text: nodeName })

        if (--cbCount == 0) callback(jsData);
    }
    viewer.getObjectTree(function (objectTree) {
        tree = objectTree;
        var rootId = tree.getRootId()
        var nodeName = viewer.model.getInstanceTree().getNodeName(rootId)
        jsData.push({ id: rootId, parent: '#', text: nodeName })
        var allLeafComponents = getLeafComponentsRec(rootId, '#');

    });
}

To use the function,

getAllLeafComponents(viewer, function (jsonData) {
    console.log(jsonData);
})

It dumps the tree, which can be used with JSTree. Since the data tells DbId, when the JStree node is clicked, get out dbId, and call

viewer.fitToView([dbId])

It will zoom to the object.

enter image description here

Upvotes: 1

Related Questions