TOC | documentation | demo | community | npm package
This library is a collection of BIM tools based on Three.js and other libraries. It includes pre-made features to easily build browser-based 3D BIM applications, such as postproduction, dimensions, floorplan navigation, DXF export and much more.
You need to be familiar with Three.js API to be able to use this library effectively. In the following example, we will create a cube in a 3D scene that can be navigated with the mouse or touch events. You can see the full example here and the deployed app here.
import * as THREE from "three";
import * as OBC from "openbim-components";
// Get the <div> element where the scene will be displayed
const container = document.getElementById('container');
// Initialize the basic components needed to use this library
const components = new OBC.Components();
components.scene = new OBC.SimpleScene(components);
components._renderer = new OBC.SimpleRenderer(components, container);
components.camera = new OBC.SimpleCamera(components);
components.raycaster = new OBC.SimpleRaycaster(components);
components.init();
// Add some elements to the scene
components.scene.setup();
const scene = components.scene.get();
const geometry = new THREE.BoxGeometry(3, 3, 3);
const material = new THREE.MeshStandardMaterial({ color: "red" });
const cube = new THREE.Mesh(geometry, material);
cube.position.set(0, 1.5, 0);
scene.add(cube);
components.meshes.push(cube);