VTK.wasm viewer

Thanks to VTK.wasm we are getting close to full parity with what is available in VTK C++ and therefore we can create viewers that display scenes equivalent to what you can produce with ParaView or VTK.

The code snippet available below show you how you can embed a static 3D scene inside a web page.

html

<html>
    <head>
        <script src="https://unpkg.com/@kitware/trame-vtklocal@1.1.1/dist/umd/viewer.umd.js"></script>
    </head>
    <body style="margin: 0">
        <div id="viewer"></div>
        <script>
            vtkWASMViewer.createViewer(
                "#viewer",
                "/vtk-wasm/data/bike-export.wazex",
                "/vtk-wasm/wasm32/latest",
                {
                    rendering: "webgl", // 'webgpu'
                },
            );
        </script>
    </body>
</html>

The createViewer method give you the opportunity to fill a DOM element using a selector and the path of the data to load. Additionally, you can provide the path to the WASM library to load unless it is imported as a script. Finally, you can configure your running by setting the rendering backend and execution mode.

Below is the result of the code above.

VTK.wasm viewer ​

VTK.wasm viewer