Skip to content

Commit

Permalink
chore: update readme
Browse files Browse the repository at this point in the history
  • Loading branch information
agviegas committed Feb 28, 2024
1 parent 16a9b11 commit 016ca6e
Showing 1 changed file with 7 additions and 63 deletions.
70 changes: 7 additions & 63 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,78 +7,22 @@
|
<a href="https://people.thatopen.com/">community</a>
|
<a href="https://www.npmjs.com/package/bim-fragment">npm package</a>
<a href="https://www.npmjs.com/package/openbim-clay">npm package</a>
</p>

![cover](resources/cover.png)

<h1>BIM Fragment <img src="https://thatopen.github.io/engine_components/resources/favicon.ico" width="32"></h1>
<h1>Clay <img src="https://thatopen.github.io/engine_components/resources/favicon.ico" width="32"></h1>

[![NPM Package][npm]][npm-url]
[![NPM Package][npm-downloads]][npm-url]
[![Tests](https://github.com/ThatOpen/engine_components/actions/workflows/tests.yml/badge.svg)](https://github.com/ThatOpen/engine_components/actions/workflows/tests.yaml)

This library is a geometric system to efficiently display 3D BIM data built on top of [Three.js](https://github.com/mrdoob/three.js/). Specifically, it uses [InstancedMeshes](https://threejs.org/docs/#api/en/objects/InstancedMesh) to draw each set of repeated geometries (which are abundant in BIM models) using a single draw call.
Work in progress.

- It uses [flatbuffers](https://flatbuffers.dev/) to persist data as a binary format efficiently.
- It prevents [memory leaks](https://threejs.org/docs/#manual/en/introduction/How-to-dispose-of-objects) exposing a `dispose()` method.
This library is a 3D geometry and modelling engine that works natively with IFC.

You generally won't need to interact with this library direclty. Instead, you can use [components](https://github.com/ThatOpen/engine_components), which provides an abstraction layer of tools that use this format and make the creation of BIM tools very easy.

### Usage

You need to be familiar with [Three.js API](https://github.com/mrdoob/three.js/) 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](https://github.com/ThatOpen/engine_components/blob/main/src/core/SimpleScene/index.html) and the deployed app [here](https://thatopen.github.io/engine_components/src/core/SimpleScene/index.html).

```js
import * as FRAGS from 'bim-fragment';

const canvas = document.getElementById('container');

// Simple three.js scene: check the resources folder of this repo
const threeScene = new SimpleThreeScene(canvas);

let chairs;

const serializer = new FRAGS.Serializer();

async function importChairsBinary() {
if (chairs !== undefined) return;
const fetched = await fetch("../resources/chairs.frag");
const rawData = await fetched.arrayBuffer();
const buffer = new Uint8Array(rawData);
chairs = serializer.import(buffer);

for(const frag of chairs) {
threeScene.scene.add(frag.mesh);
}
}

function deleteChairs() {
if (!chairs) return;
for(const frag of chairs) {
frag.dispose(true);
}
chairs = undefined;
}

async function exportChairsBinary() {
if (!chairs) return;

const buffer = serializer.export(chairs);
const file = new File([new Blob([buffer])], "chairs.frag");
const link = document.createElement('a');
document.body.appendChild(link);

link.download = 'chairs.frag';
link.href = URL.createObjectURL(file);
link.click();

link.remove();
}
```



[npm]: https://img.shields.io/npm/v/bim-fragment
[npm-url]: https://www.npmjs.com/package/bim-fragment
[npm-downloads]: https://img.shields.io/npm/dw/bim-fragment
[npm]: https://img.shields.io/npm/v/openbim-clay
[npm-url]: https://www.npmjs.com/package/openbim-clay
[npm-downloads]: https://img.shields.io/npm/dw/openbim-clay

0 comments on commit 016ca6e

Please sign in to comment.