8

I have developed a simple three.js application that renders a cube, and which have several buttons to set fixed camera positions. I have a demo of my code here: https://jsfiddle.net/ph0ropg7/9/

In my application I render a cube, and I can change to the top view (with the TOP VIEW button), and I can adjust the cube to the screen with the SHOW ALL button. However, I noticed three strange things:

  • When I pan the cube and then I rotate it, if I press the SHOW ALL button, the camera orientation changes when the cube is adjusted to the screen size.

  • When I set the top view with its corresponding button, the controls seems to be blocked or something like this.

  • If I set the top view by clicking on the TOP VIEW button, and dragging before releasing the mouse left button, the controls seems to become crazy. The objects keeps vibrating in a very strange and annoying way.

I am very new to three.js and I cannot figure out why this three things are happening. Any help or suggestion to face any of these issues will be appreciated, thanks.

GLR
  • 1,070
  • 1
  • 11
  • 29
  • I dont understand what you mean with point 1. You don't want the camera orientation to change? you explicitly tell it to with the line ```camera.lookAt(look_at_position);``` in ```function ShowAll()``` – micnil Sep 15 '17 at 16:57
  • 2
    I've experimented a bit, but haven't come to any conclusions yet. I agree that the behaviour is strange. Maybe I just don't understand the code fully yet, but do you even need to call ```_reset_controls_after_camera_movement()``` in ```SetTopView()```? seems to work fine after removing that line. Also found an open [bug report](https://github.com/mrdoob/three.js/issues/11799) regarding the ```reset()``` method of OrthographicTrackballControls. Maybe this could be causing the strange behaviour... – micnil Sep 16 '17 at 13:54
  • @micnil in point 1, what I mean is the following. With the _SHOW ALL_ button I want to center the object to the screen, whatever its current orientation. With my code, the cube is "rotated" after pressing that button (when I do it as described in point 1). To be more exact, the camera is rotated, not the cube. – GLR Sep 19 '17 at 11:06
  • @Rabbid76 your solution adjusts the cube to the screen with the _SHOW ALL_ button, but it always have the same orientation. That is not what I am looking for. I would like to adjust the cube to the screen, but preserving the orientation given by the user with the controls. I mean, to move and zoom it to center it in the screen, but with no rotation. – GLR Sep 19 '17 at 11:07
  • I could not reproduce #3 of the "three strange things" while using the Chrome browser. What browser did you use to view the vibrating objects? – JohnH Sep 19 '17 at 14:02
  • I am using Google Chrome version 59.0.3071.115. – GLR Sep 19 '17 at 14:07

1 Answers1

1

I looked at the OrthographicTrackballControls source and noticed that it uses the cameras lookAt method when performing a reset. The lookAt method will align the camera with its up vector. So what you need to do is remove the call to camera.lookAt(look_at_position); in your ShowAll & ShowTop functions and add controls.up0.copy(camera.up); in your _reset_controls_after_camera_movement method. The control will now have the correct up vector and can perform the lookat for you.

here's a modified fiddle

micnil
  • 4,705
  • 2
  • 28
  • 39