xeolabs bio photo

xeolabs

Lindsay Kay

3D software engineer / WebGL developer

Twitter LinkedIn Github


My chapter on SceneJS for OpenGL Insights is now free to download!

BIMData™ Online BIM Viewer

In 2018, I developed the WebGL-based 3D BIM viewer within BIMData, a cutting-edge platform to manage your construction projects that provides an all-in-one solution to visualize, check, edit and share building information.

For this job, I also subcontracted David Lenaerts, a freelance graphics programmer, to help out with the math for 3D gizmo interactions.

The Client

BIMData is a company in Nice, France that provides a cutting-edge online platform to manage your construction projects, including an all-in-one solution to visualize, check, edit and share building information.

Requirements

  • Implement a WebGL-based viewer to view large 3D IFC models online
  • Load IFC models from glTF
  • Emphasis effects such as ghosting, highlighting etc.
  • User annotations
  • Cross section views
  • Isolated object views
  • Measurement tools
  • A navigation gizmo similar to AutoDesk ViewCube
  • Orbit, first-person and walking navigation

Solution

I implemented the BIM viewer as a wrapper class around xeogl, which is an open source (MIT) library I created for WebGL-based 3D visualization.

Architecture

The viewer is a facade class that wraps xeogl in a set of application-specific functions, and has a plugin architecture into which we can incrementally add various tools and gizmos as we create them.

glTF models

TODO

Annotations

Annotations are notes that users pin to the surface of models. These were based on xeogl’s experimental Annotation components.

Cross-section views

The user can create an unlimited number of custom clipping planes, which they can arrange using mouse/touch input. The clip planes use xeogl’s native Clip components, which users can interactively arrange using our fancy editing gizmo. This is one of the bits that David Lenaerts helped out with.

ViewCube

Our ViewCube is a 3D camera orientation indicator and controller. I implemented it to look and work the same as the one by Autodesk Research. Our ViewCube is a 3D object implemented with xeogl, with clickable hotspots that fly the camera to various vantage points.

Emphasis effects

xeogl has some built-in emphasis effects, such as ghosting and wireframe, which we’re using for highlighting and revealing BIM objects.



Edge emphasis and ghosting effects for X-ray view:

Measurement tools

TODO

Camera navigation

TODO

BCF

The BIM Collaboration Format (BCF) is an open file format that supports workflow communication in BIM processes. Our BCF system captures the complete visual state of the viewer as a JSON BCF record, along with PNG canvas snapshot.

TODO

Object view

TODO

Contents