Skip to main content

BIM Viewer Tools

The BIM viewer toolbar is built from a list of Tool objects defined in bimToolbarTools(). Each tool is a React component rendered in a ToolbarSubmenu and activated/deactivated via ToolsContext.

Source: @collabdt/core/components/viewers/bim/src/tools/

Available Tools​

Tool IDComponentDescription
bim-clippingClippingToolAdd and remove section planes to cut through the model
bim-camera-fitFitCameraToolFit camera to the loaded model
bim-addAddToBimAdd files, comments, sensors, IFC/BCF/CAD/IDS content
bim-dimensionsMeasureBimToolMeasure distances and areas in the 3D model
bim-inspectInspectBimToolInspect element properties by clicking
bim-shareShareBimToolShare a link to the current camera position

ClippingTool​

Adds section planes to the Three.js scene using @thatopen/components-front. Each plane is rendered with a LineMaterial outline.

Behaviour​

  • Activates via ToolsContext dispatch SET-TOOL with tool.id.
  • Sets the viewer cursor to a crosshair while active.
  • On double-click, a clipping plane is added at the clicked point.
  • Keyboard shortcut clears all planes when active.
  • Deactivates when another tool is selected — planes persist until explicitly removed.

Dependencies​

@thatopen/components (OBC), @thatopen/components-front (OBF), three.js

AddToBim​

Submenu with sub-tools for attaching content to the BIM model:

Sub-toolDescription
bim-add-commentPin a comment to a 3D position
bim-add-fileAttach a file at a 3D position
bim-add-sensorPlace a sensor in the model
bim-add-ifcLoad an additional IFC model
bim-add-bcfImport a BCF topic file
bim-add-cadImport a DXF/CAD file via AddDxf
bim-add-idsImport an IDS validation file

Position is set by clicking in the 3D view, captured as x, y, z coordinates relative to the model.

MeasureBimTool​

Measures distances and areas by clicking points in the model. Uses Three.js raycasting.

Notes​

InspectBimTool​

Activates element inspection mode. On click, highlights the selected element and reads its IFC properties. Supports line and area inspect types.

Behaviour​

  • Sets cursor to a pointer while active.
  • Attaches a click listener to the viewer container's canvas element.
  • Removes the listener on deactivate.

FitCameraTool​

Fits the Three.js camera to the bounding box of the loaded model. Single-action tool — no persistent active state.

ShareBimTool​

Generates a shareable URL encoding the current camera position. Reads from BimContext.

Activating a tool​

Tools are activated and deactivated through ToolsContext:

const { dispatch } = useContext(ToolsContext)

// Activate
dispatch({ type: 'SET-TOOL', payload: { currentToolId: 'bim-clipping' } })

// Deactivate
dispatch({ type: 'SET-TOOL', payload: { currentToolId: null } })

Only one tool is active at a time. When a new tool is activated, the previous tool's component is responsible for cleaning up (removing event listeners, resetting cursor, etc.).

Key Files​

FileRole
@collabdt/core/components/viewers/bim/src/tools/bimToolbar.tsTool list definition
@collabdt/core/components/viewers/bim/src/tools/ClippingTool/ClippingTool.tsxClipping plane tool
@collabdt/core/components/viewers/bim/src/tools/AddToBim/index.tsxAdd content sub-menu
@collabdt/core/components/viewers/bim/src/tools/InspectBimTool.tsxElement inspection
@collabdt/core/components/viewers/bim/src/tools/measureBimTool.tsxDistance/area measurement
@collabdt/core/components/viewers/bim/src/tools/FitCameraTool.tsxFit camera
@collabdt/core/components/viewers/bim/src/tools/shareBimTool.tsxShare camera position

Permissions​