Camera Alpha, Beta

Questions
1

Hi there,
Thanks everyone for helping me to resolve previous issue.

I have mesh with texture, I have button to toggle camera view. I toggle camera view with help of alpha beta values based on onClick event. toggle works fine from left an right view but at the same time mesh changes its position and i dont want mesh to change position other then different view based on camera alpha values. Any suggestions please.

Here is codesandbox link : boring-gould-hzivf2 - CodeSandbox

Thanks in advance

2

It seems that you use ArcRotateCamera, which does set camera position (not mesh position) according to alpha/beta. A solution could be to use Free- or UniversalCamera and change rotation values to your needs, this way relative position of camera and mesh won’t change? You can use the first parameter of default camera creation:

createDefaultCameraOrLight(false, true, true)

But I would recommend to create camera once manually, because I am not sure if your re-creations do change camera position. Maybe test both and reply?

3

Thanks for response @Takemura.

Im using default camera, but if i change first value to false scene.createDefaultCameraOrLight(false, true, true); then alpha wont work.

const addCamera = () => {
  //camera pointing at your model.
  scene.createDefaultCameraOrLight(true, true, true);
  var camera = scene.getCameraByID("default camera");
  // To stop upper and lower roatation and rotate camera only left direction and right direction
  camera.upperBetaLimit = BABYLON.Tools.ToRadians(90)
  camera.lowerBetaLimit = BABYLON.Tools.ToRadians(90)
  //Center
  // camera.beta = 2.5;
  camera.alpha = 1.5;
  camera.radius = 2.5;
  camera.detachControl(canvas, true)
};


and onClick of Button i change alpha value 

  const handleLeft = () => {
    scene.createDefaultCameraOrLight(true, true, true);
    var camera = scene.getCameraByID("default camera");
    camera.upperBetaLimit = BABYLON.Tools.ToRadians(90);
    camera.lowerBetaLimit = BABYLON.Tools.ToRadians(90);
    camera.alpha = 2.0;
    camera.radius = 2.5;
    camera.detachControl(canvas, true);
  }

  const handleRight = () => {
    scene.createDefaultCameraOrLight(true, true, true);
    var camera = scene.getCameraByID("default camera");
    camera.upperBetaLimit = BABYLON.Tools.ToRadians(90);
    camera.lowerBetaLimit = BABYLON.Tools.ToRadians(90);
    camera.alpha = 1.0;
    camera.radius = 2.5;
    camera.detachControl(canvas, true);
  }

The mesh will be at top and onclick of button mesh position changes to down.
4

Yes, then you have to change camera.rotation.x, camera.rotation.y or camera.rotation.z.

1 Like
5

If you already change all these, why keep with the default camera? I guess I would just create one.

6

@mawa @Takemura Thanks for suggestions.

Changing scene.createDefaultCameraOrLight(true, true, true); to scene.createDefaultCameraOrLight(true, false, true); helped me resolve issue.

3 Likes