Visualizing DeviceOrientation Events #
I was looking to play around with the DeviceOrientation events (which are now supported by iOS devices, in addition to Chrome and Firefox), but I was having trouble picturing all the event fields, and how they would change in response to the device being moved.
I therefore made a simple visualization of the deviceorientation
and devicemotion
events. It just plots the acceleration
(or accelerationIncludingGravity
if that's not available) and alpha
, beta
and gamma
fields from the events. Incidentally, to get <canvas>
to render at a 1:1 pixel mapping to the iPhone 4's high resolution screen, a similar technique to the one used for images can be used (i.e. make the canvas displayed size be half of its actual pixel dimensions).
Post a Comment