Version 2.0.0

Version 2.0.0 Details

List of all changes

Paintables

Paintables can be used to let the client/browser draw graphics like SVG onto the 3d model.
See detailed Paintables description for more info.

autofocusActiveCamera

The new convenience function autofocusActiveCamera can be used to quickly "re-center" the camera to show the whole scene.

It also adjusts some properties of the camera controls like panning sensibility, wheel precision etc. to gain more consistency in the usability of 3d models regardless of their size, scale, etc.

Events & Parameters

All built in parameters and events thrown by any part of the viewer are now exported by the classes Parameter & Event which simplifies usage as there's no more need to use "magic strings" in your code.

Before:

const spec = {
variants: {
dirtbike: {
elements: {
Bumper: [
/* ... */
],
},
parameters: {
'Bumper.material.color': '#FF3200', // <-------
},
},
},
};

// ...

viewer.on(
'sceneProcessingEnd', // <-------
scene => {
/* ... */
}
);
await viewer.bootstrap();

viewer.variantInstances.commitParameters({
'Bumper.material.color': '#E45115', // <-------
});

Now:

const spec = {
variants: {
dirtbike: {
elements: {
Bumper: [
/* ... */
],
},
parameters: {
[`Bumper.${Parameter.MATERIAL_COLOR}`]: '#FF3200', // <-------
},
},
},
};

// ...

viewer.on(
Event.SCENE_PROCESSING_END, // <-------
scene => {
/* ... */
}
);
await viewer.bootstrap();

viewer.variantInstances.commitParameters({
[`Bumper.${Parameter.MATERIAL_COLOR}`]: '#E45115', // <-------
});

Even though the new code may look a little more "convoluted" at first glance, it prevents errors due to typos & misspellings and simplifies writing the code as it allows the IDE to give you code completion. Also you can "browse" through the available built in parameters and events within your IDE without having to open the docs.

See the classes Parameter and Event as well as the Parameters description for more detailed info.

Sync to async

The following functions have been changed to return an asynchronous promise instead of a synchronous return value:

This change brings our Viewer API more "in line" with how the underlying Babylon.js core actually works and therefore allows us greater flexibility for future changes.

Whilst it is highly recommended that you change your implementation to also use the async/promise style when using those functions, you probably won't notice any immediate change or issues even if you don't adjust your code accordingly.

Generated using TypeDoc