# \#device-orientation

**URL:** https://discourse.threejs.org/tag/device-orientation/241.md

[Latest](https://discourse.threejs.org/latest.md) · [Categories](https://discourse.threejs.org/categories.md) · [Tags](https://discourse.threejs.org/tags.md)

---

## [Synchronize perspective camera position while switching between OrbitControls and DeviceOrientationControls](https://discourse.threejs.org/t/synchronize-perspective-camera-position-while-switching-between-orbitcontrols-and-deviceorientationcontrols/70806)

<div class="topic-metadata">

**Author:** [@armkh](https://discourse.threejs.org/u/armkh)\
**Replies:** 0\
**Last updated:** [September 17, 2024, 9:39am UTC](https://discourse.threejs.org/t/synchronize-perspective-camera-position-while-switching-between-orbitcontrols-and-deviceorientationcontrols/70806 "2024-09-17T09:39:39Z")

</div>

In my application ( React JS ) I’m switching between orbit controls and device orientation controls import { DeviceOrientationControls, OrbitControls } from '@react-three/drei'; ... const \[isGyroscope, setIsGyroscop…

---

## [Cant find Device Orientation Control on three js project](https://discourse.threejs.org/t/cant-find-device-orientation-control-on-three-js-project/33456)

<div class="topic-metadata">

**Author:** [@Nursefa\_Baybara](https://discourse.threejs.org/u/Nursefa_Baybara)\
**Replies:** 3\
**Last updated:** [July 10, 2024, 4:56am UTC](https://discourse.threejs.org/t/cant-find-device-orientation-control-on-three-js-project/33456 "2024-07-10T04:56:24Z")

</div>

I need to use Device Orientation Control, all examples exporting from threejs but I cant find it, are they removed or updated the file?

---

## [Pearl Jam Dark Matter Observer](https://discourse.threejs.org/t/pearl-jam-dark-matter-observer/63068)

<div class="topic-metadata">

**Author:** [@leemartin](https://discourse.threejs.org/u/leemartin)\
**Replies:** 2\
**Last updated:** [March 21, 2024, 1:32pm UTC](https://discourse.threejs.org/t/pearl-jam-dark-matter-observer/63068 "2024-03-21T13:32:00Z")

</div>

I felt inclined to share this project on the forum due to how many incredible learnings I’ve gained from all of you (here) during the construction of this app. The app in question is the Pearl Jam Dark Matter Observer, l…

---

## [WebXR getViewerPose ( referenceSpace )](https://discourse.threejs.org/t/webxr-getviewerpose-referencespace/12338)

<div class="topic-metadata">

**Author:** [@ultralowpoly](https://discourse.threejs.org/u/ultralowpoly)\
**Replies:** 3\
**Last updated:** [August 24, 2023, 3:44pm UTC](https://discourse.threejs.org/t/webxr-getviewerpose-referencespace/12338 "2023-08-24T15:44:03Z")

</div>

What is the correct way to retrieve headset orientation data (x, y, z or matrix) in Three.js (Three.js/WebXR) with respect to referenceSpace? (Reason: I need to modify textures and add/remove some objects whose presence…

---

## [How do I get north in a webxr session](https://discourse.threejs.org/t/how-do-i-get-north-in-a-webxr-session/44163)

<div class="topic-metadata">

**Author:** [@Doug\_Lapsley](https://discourse.threejs.org/u/Doug_Lapsley)\
**Replies:** 0\
**Last updated:** [October 31, 2022, 8:26am UTC](https://discourse.threejs.org/t/how-do-i-get-north-in-a-webxr-session/44163 "2022-10-31T08:26:13Z")

</div>

I’m implementing a three.js webxr web app and trying to get the real-world compass orientation relative to the three.js scene so that I can place objects oriented to north in the AR. e.g. Place an arrow on the floor poi…

---

## [Device motion control and camera rotation calculation error](https://discourse.threejs.org/t/device-motion-control-and-camera-rotation-calculation-error/42955)

<div class="topic-metadata">

**Author:** [@MysticWhiteDragon](https://discourse.threejs.org/u/MysticWhiteDragon)\
**Replies:** 2\
**Last updated:** [October 18, 2022, 6:30pm UTC](https://discourse.threejs.org/t/device-motion-control-and-camera-rotation-calculation-error/42955 "2022-10-18T18:30:57Z")

</div>

I’m trying to use a smartphone’s gyroscope to rotate a camera. It works great in portrait mode. However, in landscape mode it seems to be off by about 30 degrees. I have modified the code so I can get it to work prope…

---

## [Blender like Orbit Controls Gizmo for Three.js](https://discourse.threejs.org/t/blender-like-orbit-controls-gizmo-for-three-js/27527)

<div class="topic-metadata">

**Author:** [@Fennec](https://discourse.threejs.org/u/Fennec)\
**Replies:** 10\
**Last updated:** [September 21, 2022, 1:15pm UTC](https://discourse.threejs.org/t/blender-like-orbit-controls-gizmo-for-three-js/27527 "2022-09-21T13:15:35Z")

</div>

Hello everyone, Here’s a lightweight Blender like orientation gizmo for Three.js, it work in tandem with a slightly modified version of THREE.OrbitControls, it follow the orbit controls rotations changes and you can cha…

---

## [Update PerspectiveCamera position with the device motion: acceleration](https://discourse.threejs.org/t/update-perspectivecamera-position-with-the-device-motion-acceleration/35021)

<div class="topic-metadata">

**Author:** [@adg](https://discourse.threejs.org/u/adg)\
**Replies:** 3\
**Last updated:** [February 22, 2022, 9:15am UTC](https://discourse.threejs.org/t/update-perspectivecamera-position-with-the-device-motion-acceleration/35021 "2022-02-22T09:15:44Z")

</div>

Hi everyone :wave: I would like to build an AR experience (without web xr). The idea is to populate your surrounding with 3D cubes and be able to walk around them. I’ve created a github/codesandbox with a minimal demo. …

---

## [Switch DeviceOrientationControl / OrbitControl](https://discourse.threejs.org/t/switch-deviceorientationcontrol-orbitcontrol/33749)

<div class="topic-metadata">

**Author:** [@ilamarche](https://discourse.threejs.org/u/ilamarche)\
**Replies:** 0\
**Last updated:** [January 17, 2022, 6:00pm UTC](https://discourse.threejs.org/t/switch-deviceorientationcontrol-orbitcontrol/33749 "2022-01-17T18:00:50Z")

</div>

Hi everyone, little tip discovered by chance today. I’m looking to do 360° and switch between DeviceOrientationControl and OrbitControl. Since the beginning I try to have the DeviceOrientationControl active on mobile an…

---

## [DeviceOrientation controls Lock view to Model and only use Subtle movement ? (like facebook 3d photo)](https://discourse.threejs.org/t/deviceorientation-controls-lock-view-to-model-and-only-use-subtle-movement-like-facebook-3d-photo/31983)

<div class="topic-metadata">

**Author:** [@orion\_prime](https://discourse.threejs.org/u/orion_prime)\
**Replies:** 0\
**Last updated:** [November 22, 2021, 4:59pm UTC](https://discourse.threejs.org/t/deviceorientation-controls-lock-view-to-model-and-only-use-subtle-movement-like-facebook-3d-photo/31983 "2021-11-22T16:59:50Z")

</div>

I know device DeviceOrientation example has been removed due to inconsistent behavior across devices but ii think this usecase can still work without issues . Camera is fixed and only small movement is used to tilt the…

---

## [Need a callback for DeviceOrientationControls permission cancel/accept](https://discourse.threejs.org/t/need-a-callback-for-deviceorientationcontrols-permission-cancel-accept/31685)

<div class="topic-metadata">

**Author:** [@uvfauna](https://discourse.threejs.org/u/uvfauna)\
**Replies:** 1\
**Last updated:** [November 18, 2021, 4:18pm UTC](https://discourse.threejs.org/t/need-a-callback-for-deviceorientationcontrols-permission-cancel-accept/31685 "2021-11-18T16:18:18Z")

</div>

Hi everyone, I’m using DeviceOrientationControls to control my camera. I initialise my controls (of which the Three-js camera is a child) like this: this.gyroscope = new DeviceOrientationControls(this.controls.gyroscop…

---

## [How to switch between orbit controls and device orientation controls(R3F)](https://discourse.threejs.org/t/how-to-switch-between-orbit-controls-and-device-orientation-controls-r3f/29563)

<div class="topic-metadata">

**Author:** [@Hamid\_Nawaz](https://discourse.threejs.org/u/Hamid_Nawaz)\
**Replies:** 2\
**Last updated:** [September 6, 2021, 5:43am UTC](https://discourse.threejs.org/t/how-to-switch-between-orbit-controls-and-device-orientation-controls-r3f/29563 "2021-09-06T05:43:11Z")

</div>

Hey, I am trying to give users an option to switch between the controls by clicking on a button. I have tried doing this {isOrbitControl ? \<OrbitControls ref={orbitControls} enableZoom={false} e…

---

## [Camera controls not working in iOS but workin on android](https://discourse.threejs.org/t/camera-controls-not-working-in-ios-but-workin-on-android/24655)

<div class="topic-metadata">

**Author:** [@rudrjain](https://discourse.threejs.org/u/rudrjain)\
**Replies:** 6\
**Last updated:** [March 31, 2021, 4:33am UTC](https://discourse.threejs.org/t/camera-controls-not-working-in-ios-but-workin-on-android/24655 "2021-03-31T04:33:25Z")

</div>

Please check this link this is working perfectly fine on android devices but not on iOS device link : Display Webcam Stream i have used the device orientation camera with backround as camera feed, in android behavior i…

---

## [Using gyroscope data without rotation around z axis](https://discourse.threejs.org/t/using-gyroscope-data-without-rotation-around-z-axis/24262)

<div class="topic-metadata">

**Author:** [@Vans](https://discourse.threejs.org/u/Vans)\
**Replies:** 2\
**Last updated:** [March 14, 2021, 10:44pm UTC](https://discourse.threejs.org/t/using-gyroscope-data-without-rotation-around-z-axis/24262 "2021-03-14T22:44:54Z")

</div>

Hello everyone, I wanted to know if it is possible to use gyroscope data in such a way that there is no rotation on the z-axis i.e lock z axis for rotation. i tried making the roll value zero but it doesn’t work I woul…

---

## [Deviceorientation controls are shaky](https://discourse.threejs.org/t/deviceorientation-controls-are-shaky/18548)

<div class="topic-metadata">

**Author:** [@ThorstenBux](https://discourse.threejs.org/u/ThorstenBux)\
**Replies:** 8\
**Last updated:** [September 28, 2020, 1:41am UTC](https://discourse.threejs.org/t/deviceorientation-controls-are-shaky/18548 "2020-09-28T01:41:51Z")

</div>

Hi, I’ve played around with the deviceorientation controls example and found that it is very shaky (jittering) on my iPhone 11 Pro. I’m wondering if this is a know issue and maybe even only an iPhone issue and if anyone …

---

## [Perspective tracking using gyroscope data](https://discourse.threejs.org/t/perspective-tracking-using-gyroscope-data/17101)

<div class="topic-metadata">

**Author:** [@emmelleppi](https://discourse.threejs.org/u/emmelleppi)\
**Replies:** 3\
**Last updated:** [July 29, 2020, 9:33am UTC](https://discourse.threejs.org/t/perspective-tracking-using-gyroscope-data/17101 "2020-07-29T09:33:12Z")

</div>

Hi everyone! I have spent the past 4 hours trying to replicate this fantastic effect with threejs on my phone. There is a perspective tracking due to the gyroscope data of the mobile phone. I don’t understand if the c…

---

## [PointerLock / DeviceOrientation - trouble with 'gravity'](https://discourse.threejs.org/t/pointerlock-deviceorientation-trouble-with-gravity/16419)

<div class="topic-metadata">

**Author:** [@Heiddo](https://discourse.threejs.org/u/Heiddo)\
**Replies:** 0\
**Last updated:** [June 21, 2020, 2:11pm UTC](https://discourse.threejs.org/t/pointerlock-deviceorientation-trouble-with-gravity/16419 "2020-06-21T14:11:41Z")

</div>

EDIT: It’s becoming embarrassing how often (even after days of failing) i write some verbose explanation of my problem - only to solve it within an hour of doing so. The problem of was - my simplistic way of using trans…

---

## [Device orientation controls - iOS - request permission or no?](https://discourse.threejs.org/t/device-orientation-controls-ios-request-permission-or-no/16271)

<div class="topic-metadata">

**Author:** [@Heiddo](https://discourse.threejs.org/u/Heiddo)\
**Replies:** 2\
**Last updated:** [June 16, 2020, 4:00pm UTC](https://discourse.threejs.org/t/device-orientation-controls-ios-request-permission-or-no/16271 "2020-06-16T16:00:29Z")

</div>

Hello! The current versions of DeviceOrientationControls examples don’t work on my OP6T, OP6, IPhone X, IPhone 11. I have the controls working on my project on my OnePlus devices. I’m still struggling getting any iOS d…

---

## [Is it possible to start using DeviceOrientation when launching a webpage?](https://discourse.threejs.org/t/is-it-possible-to-start-using-deviceorientation-when-launching-a-webpage/15916)

<div class="topic-metadata">

**Author:** [@AlejoHarris](https://discourse.threejs.org/u/AlejoHarris)\
**Replies:** 5\
**Last updated:** [June 5, 2020, 6:16pm UTC](https://discourse.threejs.org/t/is-it-possible-to-start-using-deviceorientation-when-launching-a-webpage/15916 "2020-06-05T18:16:46Z")

</div>

I have tried to use DeviceOrientation module and it works great with Android. But since iOS needs a permission from the user, I just realized the example uses a button that trigger the permission. However, I have not fou…

---

## [Orbit Controls + Orientation Controls](https://discourse.threejs.org/t/orbit-controls-orientation-controls/14241)

<div class="topic-metadata">

**Author:** [@defending1](https://discourse.threejs.org/u/defending1)\
**Replies:** 0\
**Last updated:** [April 10, 2020, 9:43am UTC](https://discourse.threejs.org/t/orbit-controls-orientation-controls/14241 "2020-04-10T09:43:26Z")

</div>

Hello, I’m developing an application that should be controlled using both touch and orientation sensors. I would like similar controls to youtube’s VR videos or aframe controls. The problem is that neither DeviceOrienta…

---

## [Rotate camera around object with device](https://discourse.threejs.org/t/rotate-camera-around-object-with-device/12295)

<div class="topic-metadata">

**Author:** [@TmszFxtrt](https://discourse.threejs.org/u/TmszFxtrt)\
**Replies:** 0\
**Last updated:** [January 23, 2020, 5:36pm UTC](https://discourse.threejs.org/t/rotate-camera-around-object-with-device/12295 "2020-01-23T17:36:13Z")

</div>

Hey guys, I’ve asked in another forum but I thought I would like to be more clear on my problem. Whats my intention? Currently I am using three.js within WebView on my android device and created a scene which contains…

---

## [Combine DeviceOrientationControls with custom touchmove rotation on Y axis](https://discourse.threejs.org/t/combine-deviceorientationcontrols-with-custom-touchmove-rotation-on-y-axis/5984)

<div class="topic-metadata">

**Author:** [@revyTH](https://discourse.threejs.org/u/revyTH)\
**Replies:** 2\
**Last updated:** [February 4, 2019, 2:43pm UTC](https://discourse.threejs.org/t/combine-deviceorientationcontrols-with-custom-touchmove-rotation-on-y-axis/5984 "2019-02-04T14:43:38Z")

</div>

Hi! I would like to combine DeviceOrientationControls with a custom logic that allow user to rotate camera around Y axis using touch move gestures. Basically I would like to achieve the same behavior (for touch devices)…

---

## [3dObject with Device-Orientation only on Smartphone and Tablet](https://discourse.threejs.org/t/3dobject-with-device-orientation-only-on-smartphone-and-tablet/5589)

<div class="topic-metadata">

**Author:** [@dario.good.guy](https://discourse.threejs.org/u/dario.good.guy)\
**Replies:** 2\
**Last updated:** [January 8, 2019, 12:43pm UTC](https://discourse.threejs.org/t/3dobject-with-device-orientation-only-on-smartphone-and-tablet/5589 "2019-01-08T12:43:37Z")

</div>

Hi, I had a question, I wondered if it was possible, as the title suggests, to make my object3d in device-orientation function only when you shrink the wireframe to a tablet or smartphone size and use another function in…

---

## [Doubts with position of objects and camera](https://discourse.threejs.org/t/doubts-with-position-of-objects-and-camera/2383)

<div class="topic-metadata">

**Author:** [@jramos](https://discourse.threejs.org/u/jramos)\
**Replies:** 3\
**Last updated:** [April 11, 2018, 7:41am UTC](https://discourse.threejs.org/t/doubts-with-position-of-objects-and-camera/2383 "2018-04-11T07:41:53Z")

</div>

Hi, I’m developing a scenary with a CubeTexture with a initial camera position of (0,0,0). Inside of it a plane geometry manually positioned like this: var geometry = new THREE.PlaneGeometry(1.5 \* SCALE, 1 \* SCALE); va…

---

## [Add DeviceOrientationControls to StereoEffect example](https://discourse.threejs.org/t/add-deviceorientationcontrols-to-stereoeffect-example/2281)

<div class="topic-metadata">

**Author:** [@jramos](https://discourse.threejs.org/u/jramos)\
**Replies:** 7\
**Last updated:** [March 29, 2018, 5:12pm UTC](https://discourse.threejs.org/t/add-deviceorientationcontrols-to-stereoeffect-example/2281 "2018-03-29T17:12:02Z")

</div>

Hi First, I’m new on threejs, sorry. I am trying to add deviceorientation controls to the stereo effect example of the web. This is my code \<!DOCTYPE html\> \<html lang="en"\> \<head\> \<title\>three.js webgl - effects - s…

---

## [Clamp device orientation controls](https://discourse.threejs.org/t/clamp-device-orientation-controls/1355)

<div class="topic-metadata">

**Author:** [@chriship](https://discourse.threejs.org/u/chriship)\
**Replies:** 1\
**Last updated:** [December 9, 2017, 2:36am UTC](https://discourse.threejs.org/t/clamp-device-orientation-controls/1355 "2017-12-09T02:36:37Z")

</div>

I’m struggling to figure out how to clamp the device orientation controls to say 180 degrees rather than allowing the full 360. Does anyone know how to do this?

---

## [Reliable way to point north?](https://discourse.threejs.org/t/reliable-way-to-point-north/669)

<div class="topic-metadata">

**Author:** [@chintler](https://discourse.threejs.org/u/chintler)\
**Replies:** 2\
**Last updated:** [July 31, 2017, 5:03pm UTC](https://discourse.threejs.org/t/reliable-way-to-point-north/669 "2017-07-31T17:03:47Z")

</div>

Hi, We’re trying to build a web app in which we need to know the direction in which the device camera is pointing, across browser and devices(only phones). Is there a way that we could use three.js to do this? Or some o…