BabylonJS Player: Preview-Image with Play button?

There is the support for event-based development in Babylon.js Viewer.
The viewer exposes observables that are executed when a certain event happens. At the moment, there are 3 observables currently available:

public onSceneInitObservable: PromiseObservable<Scene>; // Executed when a scene object was initialized
public onEngineInitObservable: PromiseObservable<Engine>; // Executed after the engine was created
public onModelLoadedObservable: PromiseObservable<AbstractMesh[]>; // Executed after a model was loaded.

But for your needs (if you want to save loading time and bandwidth for mobile users) it seems that better would be just load the viewer (the script itself and the model) on user’s click.
As for preview picture with play button - you may get batch screenshots from Viewer with the help of simple script and style Play button with CSS.
You may also check my small script - Progress Bar for Babylon Viewer - maybe it is almost what you need.

3 Likes