Перейти к основному содержанию

Viewer common entities and layers

Около 2 мин

Viewer common entities and layers

Layers and modules

A viewer is a set of interconnected entities (classes) that interact with each other. A general scheme of main entities is shown below:

The entire functionality of the viewer can be divided into 6 parts:

  • Attributive management - functionality responsible for loading and working with attributive data, such as properties of elements in models. It can work independently of the other parts. For example, you can load and work with element properties without loading its geometry.
  • Rendering - functionality responsible for the process of scene rendering in the browser window.
  • Geometry management - functionality responsible for managing the geometry in the scene, as well as for changing the graphical properties of elements (highlighting, hiding, isolation, search the scene, etc.).
  • Viewer extensions - functionality responsible for the possibility to extend the viewer with new functions and logic.
  • ViewerStore - a unified storage of renderer instances, because there can be several renderers with different properties, scenes, etc.

Classes and Entities

The entities of the viewer's modules are presented in more detail on the scheme:

The dotted arrows indicate the inclusion of one class into another. The solid arrows indicate the inheritance of one class from another.

Logic layer

The logic layer contains classes that implement the main functionality of the viewer.


Managers are the base classes of the viewer:

  • **RenderManagerBase **- the base renderer class. Has the root rendering functions.
  • RenderManager - the main renderer class. Inherited from RenderManagerBase. Performs scene rendering on the screen.
  • **SceneManager **- scene manager class. Controls scene loading and working with its items.
    • **SceneTools **- service class for basic operations with scene elements (hiding, isolation, changing state and color, etc.).
    • **MeshTools **- service class for elements geometry management (optimizing buffers for faster rendering, etc.).
    • **ClippingTools **- service class for cscene clipping planes management.
  • **MetaManager **- attributIve data management class. Manages the loading and retrieving of properties, associated with model elements.
  • **ExtensionsManager **- the class that manages the attached viewer extensions. Allows you to add, remove and provide access to different types of extensions.


Extensions are classes of different extension types in the viewer. There are a total of three types of extensions, represented by different base classes.

  • **ExtensionBase **- base class of an extension. All other extension classes are inherited from it. Common extensions can add any functionality to the viewer and work with its functions.
  • **ModeExtensionBase **- extension class, which implements the state of the scene (mode). From it, extensions are inherited that can add a new scene state and can store and restore it. The scene state can store element visibility, coloring, and visual style. Often such extensions are extensions which form a visual result on scene elements (e.g., the result of an analysis for geometric collisions). The Extension Manager lets you switch between states by selecting the active one.
  • ControllerExtensionBase - extension class, which implements a way to control the camera. All extensions which allow controlling the camera in the scene in different ways (flying around, passing around, moving around the floors, etc.) are inherited from this class.

UI layer

The UI layer contains functions for appending additional viewer UI components.

Common UI

The common UI provide a framework for building an extensible viewer user interface.

  • **Toolbar **- the embedded viewer toolbar. Contains basic buttons for active controller extensions and state extensions selection. It also automatically embeds components of extension toolbars (shared toolbars and dedicated toolbars).
  • **MetaTree **- the tree of model elements. Works together with MetaManager.
  • **PropsTree **- the element properties tree. Works together with MetaManager.

Extensions UI

Extensions contain special render hooks functions that the toolbar component calls and in which the extension can organize the rendering of its specific UI.

UI render functions allow extensions to have their own UI and embed it in the UI of the viewer UI.

  • **SharenToolbar UI **- specific toolbar of an extension. It is automatically embedded into the Toolbar component and is always visible.
  • **DedicatedToolbar UI **- specific toolbar of the ModeExtension. It is automatically embedded into the Toolbar component and becomes visible in the active extension that sets its state.
  • **Some additional UI **- any additional UI, which are automatically embedded into the viewer canvas and are displayed over the render area.
  • Tooltip UI - UI for the viewer hovered element tooltip feature, which are automatically embedded into the tooltip if ir enabled for current mode extension.