Camera jumping position

Questions
1

I have a scene with a square Shape, and some boxGeometry as walls, with textures. I also have a modal that pops up to select which texture you want to apply and such, but whenever I change the texture of the walls, sometimes the camera “jumps”, like so:

image
image

It seems to be somewhat unpredictable, since for me it’s a small move but for a friend it’s quite a big jump. I do try to get all the info on the camera before the modal is open, and apply it right when it’s closed. I tried disabling it. But nothing works. Not sure what I should do anymore. Any ideas?

2

There’s not really enough info here to make an informed guess what could be going on.

Are you using orbitcontrols?

Maybe try disabling orbitcontrols (controls.enabled = false) before you go into your modal, and controls.enabled= true when you’re done?

Also /and/or/maybe when you get the click to activate your modal, try event.preventDefault() event.stopPropagation()

If those aren’t the case, you probably have to post a working example in glitch/codepen that shows the issue, or a link to your thing running on the web.

3

Hi, thank you for your answer!

For a little bit more of context, yes I am using orbitcontrols and I do already use enabled to prevent it from moving, seems like the issue has more to do with re-rendering of some sorts as far as I’ve seen.

I will definitely try the onclick on the modal just in case, however I doubt that’s gonna be the problem since the same modal for items works just fine. Maybe the walls using csg could lead to problems?

I’ll try to replicate it in a smaller project too, thank you!

4

Walls shouldn’t affect it.
This is usually due to orbitcontrols being stopped/paused in the middle of a click or move…
like when the modal pops up…
and when the modal goes away orbitrcontrols squeaks out an update because it thinks its still in the middle of a click/drag.


For chain of events try something like:
User initiates the modal...
let savedCameraPosition = camera.position.clone();
let savedControlsTarget = controls.target.clone();

then you do: controls.enabled = false;

Let the modal dialog happen..
After modal dialog..

You do: controls.reset()
camera.position.copy( savedCameraPosition)
controls.target.copy( savedControlsTarget)
controls.update()