A 3D BIM viewer based on WebGL2. Minimal example:

// Set up a connection with the repository
const factory = new BimWorksClientFactory("https://dev.bim.works");
// Create a new client, based on a pre-created API Token
const client = await factory.createClientWithApiToken("[YOUR API TOKEN]");
// The unique Version UUID of your model
const versionUuid = "[VERSION_UUID]";

// The ModelManager is responsible for keeping track of which models are loaded/unloaded
const modelManager = new ModelManager(client);

// The ObjectStateManager is responsible for keeping track of certain states of loaded objects such as visibility, color, selection
const objectStateManager = new ObjectStateManager(modelManager);

// Create a new Viewer3d
const viewer = new Viewer3d(objectStateManager);

// Initialize the new viewer, make sure to only continue after the returned Promise is resolved
await viewer.initializeViewer();

// Add the canvas to the body of the page, so we can see it
document.body.appendChild(viewer.container);

// Load the required Version information from the server
const version = await client.fs.getNodeVersion(versionUuid);
// Load the model
await modelManager.addModels([version]);
// All models have now loaded successfully

Implements

Constructors

  • Create a new Viewer3d.

    Parameters

    • objectStateManager: ObjectStateManager

      The ObjectStateManager manages all object related state such as visibility, color and selection

    • OptionalloadProgressHandler: LoadProgressHandler

      An object that get's specific methods called when there is progress to be reported

    • Optionalsettings: Viewer3dSettings

      Optional settings

    Returns Viewer3d

Properties

bimSurfer: unknown
container: HTMLElement
modelManager: ModelManager
objectStateManager: ObjectStateManager

Methods

  • Parameters

    • value: unknown

    Returns unknown

  • Add a GIS Layer to the viewer

    Parameters

    Returns void

  • Add a listener for mode updates

    Parameters

    Returns void

  • Register a listener to be called whenever a point is selected in MeasurementType "POINT"

    Parameters

    • listener: ((vertexInfo: unknown) => void)
        • (vertexInfo): void
        • Parameters

          • vertexInfo: unknown

          Returns void

    Returns void

  • {@inheritDoc @bimworks/viewercommon!ObjectStateListener.colorChanged}

    Parameters

    • qids: Iterable<string>
    • color: Color

    Returns void | Promise<void>

  • {@inheritDoc @bimworks/viewercommon!ObjectStateListener.colorReset}

    Parameters

    • qids: Iterable<string>

    Returns void | Promise<void>

  • Destroys the viewer and any (heavy) resources associated with it. As long as there is a reference to the Viewer3d instance it won't be completely destroyed.

    Returns void

  • Disable any active sectionplanes

    Returns void

  • View the set of loaded models from the front

    Returns void

  • Returns unknown

    The Canvas element used for rendering 3D content

  • Get the height of the viewer in pixels

    Returns number

  • Get the width of the viewer in pixels

    Returns number

  • Called then the given object is not being hovered on anymore

    Parameters

    • qid: string

      The Qid of the object that is not being hovered over anymore

    Returns void

  • Called then the given object is being hovered on

    Parameters

    • qid: string

      The Qid of the object being hovered over

    • previousQid: string

      The Qid of the previous objects that was being hovered over

    • screenspaceLocation: vec2

      The screenspace location of the hover event. This can be useful to for example place a popup/tooltip at that location. Screenspace location is x, y coordinate between 0, 0 and canvas width,height

    Returns void

  • Initializes the Viewer3d, it is important to wait for this async method to finish before calling any other methods on the viewer

    Returns Promise<void>

  • Parameters

    • id: unknown
    • geoReference: unknown

    Returns unknown

  • Returns boolean

    Whether rendering of generated door opening directions is currently enabled

  • Returns boolean

    Whether face rendering is currently enabled

  • Returns boolean

    Whether forced two-sided rendering is currently enabled

  • Returns boolean

    Whether IFC line rendering is currently enabled

  • Returns boolean

    Whether vertex rendering is currently enabled

  • Returns boolean

    Whether wireframe rendering is currently enabled

  • Parameters

    • versionUuids: Iterable<string>

    Returns unknown

  • Parameters

    • versionUuids: Iterable<string>

    Returns unknown

  • Remove listener for mode updates

    Parameters

    Returns void

  • Parameters

    • versions: Iterable<string>

    Returns unknown

  • {@inheritDoc @bimworks/viewercommon!ObjectStateListener.removedFromSelectionSet}

    Parameters

    • qids: Iterable<string>
    • type: string

    Returns void | Promise<void>

  • Request the viewer to re-render the content

    Returns void

  • Reset the information about shown/hidden types which can be changed with setShowType

    Returns void

  • Resize the viewer. This should only ever be called when autoresizing is off. It is higly recommended to let the Viewer3d manage it's own size based on it's position within the document

    Parameters

    • width: number
    • height: number

    Returns unknown

  • Will take a screenshot of the contents of the Viewer3d.

    Parameters

    Returns Promise<Blob>

    A Blob

    The returned Blob can for example be downloaded by the user, using the following example

     const width = viewer3d.width;
    const height = viewer3d.height;
    const filename = `screencapture-${width}x${height}.png`;
    Utils.downloadBlob(blob, filename);
  • Set the face color for hovering. This color is mixed with the current color of the object (either original or overridden by user). Using a transparency component is currently not supported and results in undefined behaviour.

    Parameters

    • color: string

    Returns void

  • Set the wireframe color for hovering. This color is mixed with the default wireframe color. Using a transparency component is currently not supported and results in undefined behaviour.

    Parameters

    • color: string

    Returns void

  • Set the current viewer mode, either LOCAL (Using local coordinates) or GEO (Using geo coordinates)

    Parameters

    Returns boolean

    A boolean indicating whether the mode was changed. Note that you can only switch to GEO mode if all loaded models are georeferenced. Also note than when nothing was changed as the result of calling this method, it also returns false

  • Change the way multiselection is done (only applicable when ObjectStateManager's multiSelect is on). The default mode is SHIFT

    Parameters

    Returns void

  • Set the selection mode. Currently there are 2 modes, the default mode is SELECTION_DIRECT_PICKING.

    Parameters

    Returns void

  • Change how the selection state is visualized

    Parameters

    • visualization: SelectionVisualization

      The type of visualization to use for selection, currently this can be either WireframeSelectionVisualization or NoneSelectionVisualization

    Returns void

  • Show/hide a specific type, this overrules any visibility state of objects in the ObjectStateManager. The main reason for this method to exist is to hide common types such as IFCOPENINGELEMENT by default

    To reset these to the defaults, see resetTypes

    Parameters

    • type: string

      The (IFC) type in all uppercase, examples: "IFCSPACE", "IFCOPENINGELEMENT"

    • show: boolean

      Whether to enable/disable the given type

    Returns void

  • This method will get called when the set of selected objects has been

    Parameters

    • qids: Iterable<string>
    • qidsToUnselect: Iterable<string>
    • type: string

    Returns void | Promise<void>

  • {@inheritDoc @bimworks/viewercommon!ObjectStateListener.setVisibleSet}

    Parameters

    • shown: Iterable<string>
    • hidden: Iterable<string>
    • force: boolean

    Returns void | Promise<void>

  • View the set of loaded models from the side

    Returns void

  • Starts the viewer. The viewer will only redraw when needed.

    Returns void

  • Stops the viewer. When the viewer is stopped, the view is not updated anymore. Any changes to the viewer will be accumulated and become visible as soon as the viewer is started again The main reason for stopping the viewer would be for performance, for example when the viewer is currently hidden

    Returns void

  • Toggles the default animation, which is an animation that continously rotates the building along the Z-Axis

    Returns unknown

  • Toggle whether (generated) door openings are rendered. This only works for models that have been processed when the repository setting features.generate_door_openings had been enabled. Some models contains door opening direction geometry as IFC lines, in those cases it's best to disabled rendering generated door openings.

    Parameters

    • enabled: boolean

      True when enabled

    Returns void

  • Toggle whether faces are rendered.

    Parameters

    • enabled: boolean

      True when enabled

    Returns void

  • Toggle whether to force always rendering faces two-sided (e.a. no back face culling). This overrules whatever BIM.works Repository has decided should happen.

    Parameters

    • enabled: boolean

      True when enabled

    Returns void

  • Toggle whether the viewer is in fullscreen mode

    Parameters

    • Optionalenable: boolean

    Returns void

  • Toggle a specific GIS Layer on or off

    Parameters

    • id: string
    • show: boolean

    Returns void

  • Toggle whether ifc lines are rendered. IFC Lines are all lines that have been defined in the original IFC file, such as Axis and FootPrint representations.

    Parameters

    • enabled: boolean

      True when enabled

    Returns void

  • Toggle whether vertices are rendered. Currently this does not have much use, in the future it will be used for snapping.

    Parameters

    • enabled: boolean

      True when enabled

    Returns void

  • Toggle whether wireframes are rendered. Wireframes are usually drawn to emphesize the edges and generally make the model look better

    Parameters

    • enabled: boolean

      True when enabled

    Returns void

  • View the set of loaded models from the top

    Returns void

  • Parameters

    • qids: Iterable<string>

    Returns unknown

  • Fit the given object into view.

    Parameters

    • qids: Iterable<string>

      The Qids of the objects to fit

    • Optionaloptions: ViewFitOptions

      To provide a buffer around the objects. A percentage, where 0 means no buffer and 100 means only buffer

    Returns void

  • Fit the given models into view.

    Parameters

    • versionUuids: Iterable<string>

      The models to fit

    • Optionaloptions: ViewFitOptions

      To provide a buffer around the objects. A percentage, where 0 means no buffer and 100 means only buffer

    Returns void | Promise<void>

  • Parameters

    • value: number

    Returns unknown