Render Different Texts on Different view ports

Questions
1

Hey Folks,

I have a scene with 9 cameras, each camera has its own view port ( 2D grid).

I want to render different texts (e.g : The id of the view port) on each different view port.

How can I do this ?

2

Hi @AhmedFathyHagar and welcome to the forum

For the text by itself, you can use dynamic texture like in this example:

Dynamic Textures | Babylon.js Documentation

The idea then is to create as many quads with text as the viewport count you have.
Then associate each quad with each camera.viewport.

I guess that can be done with layers? Asking @Evgeni_Popov to be sure I’m not wrong :slight_smile:

2 Likes
3

Thanks a lot, @Cedric !

I managed to make it work based on your advice yep.

The solution in case anyone faces the same issue :

  1. For every camera, set a layer mask. e.g:
    camera_1.layerMask = 0x00010000
    camera_2.layerMask = 0x00000100
    …etc

Make sure the pairwise & between those masks is always zero.

  1. Create a dynamic texture per camera, and set its layer.layerMask property to the corresponding camera’s layer mask. e.g :

    var advancedTexture_1 = new BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI(“UI”);
    advancedTexture_1.layer.layerMask = camera_1.layerMask
    var advancedTexture_2 = new BABYLON.GUI.AdvancedDynamicTexture.CreateFullscreenUI(“UI”);
    advancedTexture_2.layer.layerMask = camera_2.layerMask

This did it for me. Thanks !

2 Likes