Moving a 3D model using a device's gyroscope

Help & Support
1

Hi All,

I want to construct a 3d model to moviment when a gyroscope sensor moviment. It’s a litle bit to explain by text, so this link shows what I want to do: http://www.raspberrypi.org/real-time-orientation-display-with-the-minimu-9-v2/
I want to make a simple model like a triangle or square to moviment like the video on the link.

Is it possible to do with PlayCanvas?

Thanks!

2

Interesting.

By default PlayCanvas can handle anything as long as there is a browser API for it. There are gamepad and orientation APIs in browsers today, so I’m not sure if they would be able to get this data.

I’d be interested to know more if you try it out.

3

It’s worth checking out this tweet from a PlayCanvas user:

https://twitter.com/DanielPettersso/status/537005147717505024

He seems to have built a project that uses that API you are interested in. The project is here.

4

Dave and Will, thanks for your help…

My idea is to make a fligh control for a quadcopter, and I want to model the movements and reactions with a 3D model. I’m trying with WebGL, but it take me a long time to make a simple cube and your movements, many line codes and the language is a litle difficult to use.
With PlayCanvas will be very fast to construct the model, but I have to understand how to use the sensors with PlayCanvas. I thing it’s similar to do games for Android, because the sensors is similar and the OS is based on Linux in two cases.

I will find how to do games for Android with PlayCanvas, the process is probably similar.

If you have more ideas I will happy!!

Thanks a lot!!

5

OK, I think I understand.

So you should be able to use the Orientation API: https://developer.mozilla.org/en-US/docs/Web/API/Detecting_device_orientation to detect your phone’s movements.

Then If you want to publish your app to Android or iOS. We have some documentation for using the XDK for Android: http://developer.playcanvas.com/user-manual/publishing/native-app-stores/

6

Dave thanks for your help, I will se if it’s possible to use browser API to detect the movements of the sensor.
I see on PlayCanvas it’s possible to insert .js scripts, maybe it’s is a solution too.

7

Hey,

i see GYRO works well on Android Devices but not on iOS. Looking forward on your support

8

You have not shared any link to troubling project or any details of an issue, it is impossible to assist without this information.

9

for example: https://playcanvas.com/project/405819/overview/tutorial-basic-mouse-input

This works on iPhone 5s and Ipod but is not working on iPhone 6 and 5 (buttons not working). Not able to figure out what could be the issue

10

Any suggestions on this, Max. Because i believe if this works my project will aslo work on gyro (iOS)

11

This project does implement mouse events, not touch events. And browsers are known to “simulate” mouse events from touch events if no touch events are attached, but this simulation is not based on any official agreed specification from W3C, so different browsers might do it differently. If you need to support touch consistently, then you need to implement touch events explicitly.

Have you tried to remote debug it? What does console shows, any errors, and if API’s are available, etc?