CODEWITHSUNDEEP
three.js
bboy
bboy

Reputation: 1408

three js sphere device controls limit camera rotation

using three js to create a sphere and adding a 360 deg picture inside. now, the photo has a black hole at the bottom.

is there a way to limit camera rotation and prevent user from seeing the very bottom of the sphere?

I have this for camera: 

this.controls = new THREE.DeviceOrientationControls(this.camera, true);

this.controls = new THREE.OrbitControls(this.camera, this.element);

target devices: mobiles support webgl.

Upvotes: 1

Views: 1675

Answers (1)

gaitat
gaitat

Reputation: 12632

From the source of the THREE.OrbitControls. As you can see you can limit the controls rotation.

// How far you can orbit vertically, upper and lower limits.
// Range is 0 to Math.PI radians.
this.minPolarAngle = 0; // radians
this.maxPolarAngle = Math.PI; // radians

// How far you can orbit horizontally, upper and lower limits.
// If set, must be a sub-interval of the interval [ - Math.PI, Math.PI ].
this.minAzimuthAngle = - Infinity; // radians
this.maxAzimuthAngle = Infinity; // radians

Upvotes: 4

Related Questions