When I set the Camera position to 801 in the Z direction, it looks like this:
Why is it so different? I just raised the camera a little bit in the Z axis, but the camera sees so much rotation
This is my code, I hope you can give me a little help, help me look at it：
This is normal situation and it can be quite shocking when you experience it for the first time. The problem is this: Orbit controls maintains consistent up direction along the Y-axis. Your code sets the camera at (512,800,-256) and turns it towards (512,0,-256). This means that the Y-axis is destroyed, because it coincides with the view direction.
The visible rotation appears “random” due to the turbulence of errors.
The easiest way to resolve this is by introducing a small change in the camera position. Change line 27 from:
camera.position.set(x, 800, y);
to
camera.position.set(x, 800, y+1);
The shift is so small, that users will not notice it, but it is big enough to overcome fluctuations of errors.
However, the best solution would be to change the orientation of the map, so that the view direction is along the Z axis, not the Y axis.
Edit: Y-coordinate is the middle one; Z-coordinate is the last one. So, the variable called y is used as Z-coordinate.
Thank you very much for your help. I have learned a lot!
I did it according to the help you gave me, and found that the first way achieved the effect I expected!
But the second way, like, Y-coordinate is the middle one; Z-coordinate is the last one. So, the variable called y is used as Z-coordinate.
The problem was that when I looked at it from higher up, I noticed that the picture was tilted and the camera wasn’t facing straight down to the ground.
Another point, I expect to be able to rotate the plane, but not flip the plane, please tell me how to deal with these two problems?
This is my modified code:
I’m not quite sure what effect you are trying to achieve. Here is a demo in pure JS, because I’m not familiar with React. The demo shows a map of the Earth. It can be zoomed, panned and rotated, but not flipped. The navigation is with OrbitControls. I hope this helps you a bit.
https://codepen.io/boytchev/full/qBMwmJB
I feel very much that you patiently taught me these, I have learned a lot, thank you!
