Accelerometer, Webgl, and Filtering

So i’m trying to see if nearables attached to items (like shoes or other retail items) can, when picked up, trigger a browser (running on a raspberry pi with bluetooth and a display) to turn a 3d model written with ThreeJS.

I’m running the service on the raspberry using node and this library. and so far I have data coming in from the nearable using the highest advertising interval for motion and sending the data via websocket to the browser. My question is in regards to how to smooth the accelerometer readings and properly handle them for display. I assume you (Estimote) have possibly solved this per seeing your shoe example but i’m unclear how to filter the readings properly. I’m concerned I need a beacon instead in order to have magnetometer readings and perhaps also use a Kalman or ComplimentaryFilter to help with this and rotate per a Quaternion (available in ThreeJS)

One simple attempt for example is using pitch and roll (converting to radians for threejs)
var roll = Math.atan2(y , z) * 57.3; var pitch = Math.atan2((- acc.x) , Math.sqrt(acc.y * acc.y + acc.z * acc.z)) * 57.3;

Anyways, the data is noisy and inconsisent but the 3d model does roughly respond. I trigger a render after the pitch and roll are calculated and set
cube.rotation.x += pitch cube.rotation.y += roll cube.rotation.z += z

Any input on how to handle this would be very welcome if anyone is doing something similar on iOS or Android or the browser

have a look at our SmartParcel app:

Anyway, without a gyroscope or an IMU there is no way to do it in a really cool way.
We are still waiting for magnetometer support in Location Beacons to improve the solution a little bit.

Best Regards