Variable loadersConst

loaders: ILoadersRegistry = ...

Viewer loaders registry. Use this registry to register custom loaders.

To implement custom loader:

  1. Define a loader class implements ILoader.

  2. Define a constructor with a viewer parameter.

  3. Override ILoader.isSupport and сheck if the loader can load the specified file.

  4. Override ILoader.load and define the logic for loading the model from the file.

    The loader should do:

    • Load model data from file. The model data must be a VSFX data buffer of VSFX data chunk.
    • Parse model data with the VisualizeJS viewer instance.
    • Synchronize viewer styles, options and overlay.
    • Update the viewer.

    The loader must emit events:

    • geometryprogress - during loading. If progress is not supported, emit it once with a value of 100% after the load is complete.
    • databasechunk - when model is loaded and ready to render.
  5. Override ILoader.dispose and release loader resources, if required.

  6. Register loader provider in the loaders registry by calling the loaders.registerLoader.

import { Loader } from "@inweb/viewer-core";
import { loaders, Viewer } from "@inweb/viewer-visualize";

class MyLoader extends Loader {
public viewer: Viewer;

constructor(viewer: Viewer) {
super();
this.viewer = viewer;
}

override isSupport(file, format): Boolean {
// place custom logic here
return ...;
}

override load(file, format, params): Promise<this> {

// place custom loading logic here
const data = ...

this.viewer.visualizeJs.getViewer().parseVsfx(data);

this.viewer.syncOpenCloudVisualStyle(false);
this.viewer.syncOptions();
this.viewer.syncOverlay();
this.viewer.resize();

this.viewer.emitEvent({ type: "databasechunk", data: model, file });

return Promise.resove(this);
};
}

loaders.registerLoader("MyLoader", (viewer) => new MyLoader(viewer));