UNPKG

@inweb/viewer-three

Version:

JavaScript library for rendering CAD and BIM files in a browser using Three.js

81 lines (80 loc) 2.81 kB
import { ILoadersRegistry } from "@inweb/viewer-core"; /** * Viewer loaders registry. Use this registry to register custom loaders. * * To implement custom loader: * * 1. Define a loader class implements {@link ILoader}. * 2. Define a constructor with a `viewer` parameter. * 3. Override {@link ILoader.isSupport} and check if the loader can load the specified file. * 4. Override {@link ILoader.load} and define the logic for loading the scene from the file. * * The loader should do: * * - Load raw data from file and convert it to the `Three.js` scene. * - Add scene to the viewer `scene`. * - Create `ModelImpl` instance with unique model ID add it to the viewer `models` list. * - Synchronize viewer options and overlay. * - Update the viewer. * * The loader must emit events: * * - `geometryprogress` - during loading (or once at 100% when complete). * - `databasechunk` - when scene is loaded and ready to render. * 5. Override {@link ILoader.dispose} and release loader resources, if required. * 6. Use `this.abortController` (defined in `Loader` class) to abort loading raw data. * 7. Register loader provider in the loaders registry by calling the {@link loaders.registerLoader}. * * @example Implementing a custom loader. * * ```javascript * import { Scene } from "three"; * import { Loader, loaders, ModelImpl, Viewer } from "@inweb/viewer-three"; * * class MyLoader extends Loader { * public viewer: Viewer; * * constructor(viewer: Viewer) { * super(); * this.viewer = viewer; * } * * override isSupport(file, format): Boolean { * // check if this loader supports the file source and format * return type file === "string" && format === "myformat"; * } * * override load(file, format, params = {}): Promise<this> { * // load raw data from file (custom loading logic) * const data = await fetch(file).then((result) => result.arrayBuffer()); * * // convert raw data to the Three.js scene (custom parsing logic) * const scene = this.parse(data); * * const modelImpl = new ModelImpl(scene); * modelImpl.id = params.modelId; * * this.viewer.scene.add(scene); * this.viewer.models.push(modelImpl); * * this.viewer.syncOptions(); * this.viewer.syncOverlay(); * * this.viewer.emitEvent({ type: "geometryprogress", data: 1, file }); * this.viewer.emitEvent({ type: "databasechunk", data: scene, file }); * * this.viewer.update(true); * * return Promise.resove(this); * }; * * private parse(data: ArrayBuffer): Scene { * // custom parsing logic * return new Scene(); * } * } * * loaders.registerLoader("MyLoader", (viewer) => new MyLoader(viewer)); * ``` */ export declare const loaders: ILoadersRegistry;