@wge/industrial-viewer

Industrial Viewer

• CHANGELOG
• API
• EVENTS

Install package

npm i @wge/industrial-viewer

Run

You'll need to set <meta name="viewport" content="width=device-width, initial-scale=1.0"> tag so that browser sets correct page size.
Otherwise there could be problems with pointer events coordinates.

Example:

import IndustrialViewer from '@wge/industrial-viewer';

const container = document.getElementById('root');
const viewer = new IndustrialViewer(container);

(async () => {
    await viewer.loadModel('path/to/model.gltf');

    // Move camera to object
    await viewer.moveCameraToObjects([4], 1000);

    // Move camera to whole model
    await viewer.moveCameraToObjects(null);

    // Select object:
    await viewer.selectObjects([1, 2, 4]);

    // Deselect object:
    await viewer.selectObjects(null);

    // Color objects:
    await viewer.colorObjects([
        {
            color: '0000ff',
            ids: [0, 1, 2]
        },
        {
            color: 'ffff00',
            ids: [3, 4, 5]
        }
    ]);

    // Show objects in the list only:
    await viewer.filterObjects([1, 2]);
})();

Model formats

We recommend you to use our special format "wmd" + "wmp" instead of "gltf".
This format allows to load model faster and uses less RAM on your device during loading.
You can convert "gltf" model or other formats to "wmd" + "wmp" using our conversion service (not public yet).