How To Switch Cameras in A Scene On Buttone Click?

[ancientholiday]

Hello,

 

In Babylon JS, only one camera is active at a time, howver you can construct multiple cameras in a scene.  How can you allow the users to swtich cameras on a button click.

 

For example, in this Three Js scene, you can hit 1 or 2 button to switch cameras, making an active camera false or true.

https://stemkoski.github.io/Three.js/Multiple-Cameras.html

 

The only example i have seen in Babylon JS is the Train example, however there is no explanation of how to switch the cameas on button click.

 

Thanks,

Moses

[Temechon]

Hello, 

scene.activeCamera = myCamera;

[ancientholiday]

 

Hello, 

scene.activeCamera = myCamera;

whenever i attach click event to myCamera, it does not change the camera.

[ancientholiday]

 

Hello, 

scene.activeCamera = myCamera;

i tried to add button 1 and button 2 attach to different cameras.  It does not work        

 

 

 var b1 = document.getElementById('b1'), b2 = document.getElementById('b2');

            //var currentCAM= camera;

            console.log(currentCAM);

            function show() {

            alert(currentCAM);

            }

            b1.onclick = function() {

                var currentCAM = camera2;

                show();

                return currentCAM;

               console.log(currentCAM);

            };

           b2.onclick = function() {

                currentCAM = camera;

               show();

                return speed;

               console.log(currentCAM);

            };

           console.log(currentCAM);

[Temechon]

Here is an example: http://www.babylonjs-playground.com/#2FY4XT

Clic in the window to switch camera.

[ancientholiday]

Here is an example: http://www.babylonjs-playground.com/#2FY4XT

Clic in the window to switch camera.

Ok.  I get it.  As a  true / false boolean situation, I can change the cameras.  I can also apply this to buttons by attaching a button to the condition:

 

switchCam = !switchCam;

 

Thanks!

[Wingnut]

Hi again, AH!

 

http://urbanproductions.com/wingy/babylon/cameras/10cam/index.html  (view source).  That's how I did it, once (BJS v1.14).  I'm not a very good coder, but... maybe there's something in there you can use.  I created and styled my buttons dynamically... with JS.  *shrug* 

 

I did a playground version of it, too, but it quit working with one of the BJS versions and I haven't fixed it yet, sorry.

 

Start simple... get some buttons, make sure they can run functions with their onclicks.  Maybe each function has a simple alert.  Flesh-out the functions (make them switch cameras) AFTER you know that your buttons are causing functions to run.  This way, you have separated the HTML/DOM activity (onclicks)... from the BJS activity (camera stuff).   Party on.

[ancientholiday]

Hi again, AH!

 

http://urbanproductions.com/wingy/babylon/cameras/10cam/index.html  (view source).  That's how I did it, once (BJS v1.14).  I'm not a very good coder, but... maybe there's something in there you can use.  I created and styled my buttons dynamically... with JS.  *shrug* 

 

I did a playground version of it, too, but it quit working with one of the BJS versions and I haven't fixed it yet, sorry.

 

Start simple... get some buttons, make sure they can run functions with their onclicks.  Maybe each function has a simple alert.  Flesh-out the functions (make them switch cameras) AFTER you know that your buttons are causing functions to run.  This way, you have separated the HTML/DOM activity (onclicks)... from the BJS activity (camera stuff).   Party on.

Your code has an interesting strategy.  Instead of switchng camera names, you actually create a new camera on button click that has the same camea name.  it seems there must be something that prevents changing the active camera names after run-time rendering has started.