Load and display two scenes at the same time

I have my main game-play scene and a 2nd scene showing a map. I’d like to use the 2nd scene as a ‘mini-map’ on the main game-play scene. Is it possible to load both at the same time and display the 2nd in a smaller window? How do I handle having two cameras in one scene?

Hi @rscott78,

Check this example, it showcases additive scene loading aka loading multiple scenes at the same time:


Thanks @Leonidas - while this appears to be good code for loading multiple scenes, it doesn’t seem to show how load multiple at the same time. I am able to use that code to load two scenes… if I don’t do oldScenes.destroy(), it does appear to load them both at the same time. This missing piece is how to manage two cameras at the same time and to make the the 2nd scene only take up a smaller corner of the main scene.

1 Like

@rscott78 For a minimap, I would suggest you use Render to texture technique, you can have a render layer camera that will render some specific layer in the environment and map that to UI texture element which is placed in the corner of the screen, you can look at this tutorial for that:

1 Like

Yes, for the minimap what @Saad_Haider said will suite this better.

The above example shows how to have two scenes loaded at the same time, the main scene that holds the UI plus a second one. In the same manner if required you could have a third loaded on top.

1 Like

Thanks @Saad_Haider

I think I am getting close, but I’m struggling with the render part where it’s in a UI element. Here’s what I did:

  • I added a 2D screen with an Image Element.
  • I modified the applyTexture.js script thusly:
    var material = this.entity.element.texture;
    material.diffuseMap = layer.renderTarget.colorBuffer;

I’m guessing that perhaps there’s no duffuseMap in the texture? I’m not entirely sure what to use to swap it. As it is, nothing appears to happen.

Side question: If I go this route, will the user be able to interact with objects in the mini map? In the regular scene, I use a raycast when the user clicks to determines what was clicked on.

Hi @rscott78 ,

Yes add a image 2d element:

Then in ApplyTexture script, do this:

Screenshot 2022-02-15 030150

The UI element will appear now.

I am not entirely sure if that would be possible with this approach, maybe @Leonidas can suggest something regarding this…

That should be:

this.entity.element.texture = layer.renderTarget.colorBuffer;

layer.renderTarget.colorBuffer is a texture.

Although, why are you getting the renderTarget from the layer? If you are using the tutorial, the renderTarget should be on the camera