Arrow keys in OrbitControls are moving left and right instead of rotating around object

Questions
1

I am trying to rotate around the scene using the arrowkeys, But instead of moving around the scene, the camera is moving left and right.

const orbit = new OrbitControls.OrbitControls(camera, renderer.domElement)
camera.position.set(0, 25, -30)
orbit.update()
orbit.listenToKeyEvents(document.querySelector("body"))
2

Hold down the ctrl or shift keys when you press the ←↑→↓ keys. It will rotate in the direction.

Example

Also, your code looks strange.

If you import like this,

import { OrbitControls } from 'three/addons/controls/OrbitControls.js'

Your above code only needs to be,

camera.position.set(0, 25, -30)

const orbit = new OrbitControls(camera, renderer.domElement)
orbit.listenToKeyEvents(window)

Also your orbit.update() serves no purpose in this case.

1 Like