Using a phones gyroscope in browser (safari/chrome etc) for 3D effect

Design help Custom code
#1

Hello! Does anyone know how you could implement accelerometer and gyroscope data from your phone to control a 3D object on mobile?

I’m looking at creating a 3D room, using divs for each ‘wall’, and having the gyroscope feature control the motion in the room.

An example of this - http://c4sr.columbia.edu/knowing-cities/

Research -


Super interesting feature. Any help would be incredible.

Thanks!

#2

Hello, have you managed to get this done?, I would really like to try it, thank you

#3

It used to be possible with a script, and it’s somehow still possible (Mouse movement IX to Accelerometer movement on iOS). However, since iOS12.1, the user is require to give the website access to accelerometer. Which is… less than ideal, if not a total deal breaker.