Zoom on a room in the viewer - autodesk-forge

Question

Now, I'm able to list the levels. I'm trying to zoom on a specific room of a given level.
I've the room dbId but when I do this :
v.fitToView(34969, v.model) (v => viewer / 34969 the dbId's room)
Camera is going to far :
I'm trying to do exactly the same camera movement than when I click on a sub item in modelStructureTool > Room
about color of a room
Here is my code with the correction :
var ulRoom = document.createElement('ul');
ulRoom.setAttribute('id','levelsList');
el.children.forEach(function(l){
var liRoom = document.createElement('li');
liRoom.setAttribute('class','room');
liRoom.setAttribute('style','cursor:pointer;color: #000; font-weigth: bold');
liRoom.onclick = function () {
console.log("l ====>", l);
viewer.fitToView( [l.dbId], viewer.model);
viewer.setThemingColor( l.dbId, viewer.model);
};
ulRoom.appendChild(liRoom);
liRoom.innerHTML = l.name;
});
viewer.fitToView is working nicely.
In my forEach, l is room :

Answer 1

The first argument must be an array, so your function call has to be changed to viewer.fitToView( [ 34969 ], viewer.model ). The 2nd argument model is optional, so it will become viewer.fitToView( [ 34969 ] ) in single model use case.
If you’re using the Viewer in multiple models case, you have to find the corresponding model from viewer.impl.modelQueue().getModels() for that room and the second argument of the Viewer3D#fitToView.
Hope it helps.
Edit:
The viewer API for changing element's color is viewer.setThemingColor( dbId, color ) and it only works for leaf nodes. After investigating the model you provided to Forge Helpdesk, I found the room which has dbId 34969 is not the leaf node of the Viewer instance tree. So, this's why the color didn't change while the API is event right.
function getLeafNodes( model, dbIds ) {
return new Promise( ( resolve, reject ) => {
try {
const instanceTree = model.getData().instanceTree
dbIds = dbIds || instanceTree.getRootId();
const dbIdArray = Array.isArray( dbIds ) ? dbIds : [dbIds]
let leafIds = [];
const getLeafNodesRec = ( id ) => {
let childCount = 0;
instanceTree.enumNodeChildren( id, ( childId ) => {
getLeafNodesRec( childId );
++childCount;
})
if( childCount == 0 ) {
leafIds.push( id );
}
}
for( let i = 0; i < dbIdArray.length; ++i ) {
getLeafNodesRec( dbIdArray[i] );
}
return resolve( leafIds );
} catch (ex) {
return reject(ex)
}
})
}
let color = new THREE.Vector4( 255/255, 0/255, 0/255, 1 );
getLeafNodes( viewer.model, [ 34969 ] )
.then( ( leafNodes ) => {
// Call setThemingColor for every leaf node.
for( let i = 0; i < leafNodes.length; i++ ) {
viewer.setThemingColor( leafNodes[i], color );
}
})
.catch( ( error ) => console.warn( error ) );
Here is the Viewer documentation: https://developer.autodesk.com/en/docs/viewer/v2/reference/javascript/viewer3d/