Installation

Floorkit is a public package on npm. You do not need a token or a private registry.

Requirements

A browser app that uses a bundler, such as Vite.
Three.js 0.168. Floorkit makes Three.js objects and your app shows them.
TypeScript is optional. The package includes its type declarations.

For a project from an empty folder, follow the quickstart. Floorkit is ESM; browser geometry needs WebAssembly. You can validate building JSON outside a browser without starting the kernel.

Install the package

Add Floorkit and its peer packages

npm install @opengeometry/floorkit three@^0.168.0 camera-controls@^2.9.0 opengeometry@^2.0.18
npm install --save-dev @types/three@^0.168.0

opengeometry is the geometry kernel. Floorkit installs it as a dependency. Install it directly too, because the next step imports its WebAssembly file.

Start the geometry kernel

The kernel is a WebAssembly file. Give its address to Floorkit one time, when your app starts. With Vite, the ?url import gives you the address.

import { Floorkit } from '@opengeometry/floorkit';
import wasmURL from 'opengeometry/opengeometry_bg.wasm?url';

export async function startFloorkit(): Promise<void> {
  await new Floorkit().setupOpenGeometry(wasmURL);
}

Wait for this call to finish before you create geometry.

Add the Vite types

TypeScript must know the ?url import. A new Vite app knows it already: its tsconfig.json has "types": ["vite/client"]. If yours does not, put this line in src/vite-env.d.ts:

/// <reference types="vite/client" />

Use one copy of Three.js

The text package currently depends on a different Three.js version. Tell npm to use your app’s version everywhere. Add this field to your app’s package.json, then run the install commands above:

{
  "overrides": {
    "three": "$three"
  }
}

npm ls three should show one version. If you installed before adding the override, follow Troubleshooting.

Use a different bundler

Floorkit needs only the address of opengeometry_bg.wasm. Each bundler that can copy a file and give you its address works. You can also copy the file into your public folder and pass its path as text.

Import from one place

All classes, functions and types come from the package root:

import { BuildingSession, type BuildingModel } from '@opengeometry/floorkit';

Documentation

Requirements

Install the package

Use one copy of Three.js

Use a different bundler

Import from one place

Next steps

Quickstart

Troubleshooting

​Requirements

​Install the package

​Use one copy of Three.js

​Use a different bundler

​Import from one place

​Next steps

Quickstart

Troubleshooting

Requirements

Install the package

Use one copy of Three.js

Use a different bundler

Import from one place

Next steps