Switching 3 Scenes - How to Set Background Image or Animations

I am having trouble with this useful pg demo: https://playground.babylonjs.com/#0S6R4I#5

Behind the 3 button scene “STEP 1”, “STEP 2”, “STEP 3” in (scenes[0}), I want either a background like 1) or 2) below. The background should be a static-image like 1, or animation like 2 instead of GRAY skybox. But neither integration is working.

1 Like

Here are the 2 scenes i want to use behind the 3 button as background.

  1. https://www.babylonjs-playground.com/#08A2BS#7

For 1 above, how to stack the PANEL onto the LAYER with the IMAGE? Does the PANEL need to be transparent?

  1. https://playground.babylonjs.com/#2EMG7Y#2

For 2 above, my integration only shows the top half of SUNSET, but the water won’t move. I think there is a conflict in the async function somewhere.

I am not sure what you mean by “stack” panel onto layer, but maybe this is what you were looking for?

I have set background for Main Menu and Scene 1, also Water+Sunset for Scene 2, while water is moving.


That is exactly what i was looking for! Ironically, I was just preparing to post PG for viewing that used a separate LAYER for the background image.