Viewer FAQ

How to access the element tree (metaTree)?

This is a property of the MetaManager.metaTree class. In order for it to be populated, a manager must be created:

const metaManager = new MetaManager();

If Tangl is deployed in on-premise mode, it is necessary to pass server addresses to it as well:

const metaManager = new MetaManager().setServer(serverURL, cacheServerURL);

Load models into the manager by passing their version IDs.

metaManager.load(moelVersionIds).onAllLoaded(()=>{
  console.log(metaManager.metaTree);
});

What are the common viewer extensions?

A list of standard viewer extensions and their properties and methods is available in the Help Center in section Tangl API - Viewer API: Guide - Common Extensions.

How to get information about the properties of all model elements at once

To get information about one element, you can use MetaManager.getElementMetaByGuid() function.

However, it is not reasonable to call this function for each element, because the model may have a lot of elements and properties and they may occupy tens and hundreds of MB.

Therefore, they are stored in packed form. If it is necessary to get all properties of all model elements at once, it is necessary to use special points on the Tangl Platform server (Swagger):

<strong>GET </strong>/api/app/metaModelsData/{id}

<strong>GET </strong>/api/app/metaModelsData/{id}/stream

They will return a packed bucket with model properties. Then it should be unpacked using the LZMA algorithm.

Why id of elements obtained through MetaManager.metaTree[0].children do not match id of elements obtained through MetaManager.getElementMetaByGuid()

MetaManager.metaTree contains not only nodes of elements, but also nodes of models themselves and groups of elements in them and usually has several levels of nesting.

Identifiers contain only end nodes, which are element nodes.

How do I change the color and/or transparency of an element(s)?

In the viewer, each element has its color and transparency set initially. There is also a state and override system that allows you to override an element's color and state. The states of elements affect how they are displayed and behave.

You can see a list of states in the ElementState enumeration.

To change color and state, the functions of the SceneTools class, available through SceneManager.tools, are used to change color and state

sceneManager.tools.setElementsState(elNums[],ElementState.Transparent);
sceneManager.tools.setElementColor(elNums[],0xff0000);

How do I set the camera position?

The camera is stored in RenderManager.camera. Its position is stored in the Camera.position property. In addition, the camera has a certain orientation, for which its matrices are responsible.

The manager also has a property RenderManager.cameraTarget - this is a point in space, where the camera is looking at. This point is important when navigating and rotating the camera around the center of something.

To set the position and rotation center of the camera, as well as to synchronize its orientation matrices, you can do the following:

renderManager.camera.position.copy(newPosition)
renderManager.cameraTarget.copy(newCameraTarget)
renderManager.camera.lookAt(newCameraTarget);

//update navigation cube orientation and request frame redraw.
renderManager.cubeControl.onNavChange();
renderManager.requestUpdate()