Jump to content

NOOB How to handle Multiple camera modes.


Recommended Posts

  • 2 weeks later...

This was a interesting subject.  The ORTHOGRAPHIC_CAMERA view the ortho rectangle is square but your browser window is not.

Since most monitors are wider than taller I used the width as a variable and the height an absolute value. So when you change

the window you need to alter the width and height of the ORTHOGRAPHIC_CAMERA based view.  What you see in the code

below is how I keep the view square while changing the browser window size. 


  // the canvas/window resize event handler
   window.addEventListener('resize',function() {
   // NOTE may have to be done all the time for correct guiAspectRatio
   // we need to resize the current view.

   if(scene.activeCamera.mode  == BABYLON.Camera.ORTHOGRAPHIC_CAMERA)
       var prevheight=scene.activeCamera.orthoTop-scene.activeCamera.orthoBottom;
       var width=document.getElementById('renderCanvas').clientWidth;
       var height=document.getElementById('renderCanvas').clientHeight;
       var zoom=prevheight/groundDimension;
       height =groundDimension * zoom;
       scene.activeCamera.orthoLeft = (-height * guiAspectRatio);
       scene.activeCamera.orthoRight = (height * guiAspectRatio);

       scene.activeCamera.orthoBottom = -height;
       scene.activeCamera.orthoTop = height;




Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...