Extending X3DOM
to Mobile
Leonard Daly
President, Daly Realism
siggraph [AT] realism.com
http://realism.com/presentations/188
Licensing Notice
This presentation is licensed as Creative Commons Attribution, Share-Alike [CC BY-SA 4.0]
Some of the material comes from other sources. Licensing for that other material may be different than that associated with the entire document. Credit for the individual pieces of content (text, graphics, images, etc.) are identified on the page where that content appears. The full credit reference is given on the Credit pages.
Overview
- Part 1
- X3DOM Overview
- Device Orientation
- Part 2
- Walkabout
- LookSensor
- SphericalVideo
- StereoView
- Adding Nodes to X3DOM
- Discussion
X3DOM Overview
- http://x3dom.org/
- JavaScript Library that implements the X3D Standard
- Relatively minor changes to work in HTML5
- Not all nodes implemented
- Additional nodes added
- Compatible with jQuery and other frameworks
- Requires one JavaScipt and one CSS external files
- Supports streaming progressive geometry with textures
- DOM & HTML Integration
- Supports animation, interaction
X3DOM Examples
Streaming Progressive Geometry
- "Happy Buddha"
- Stanford Buddha
- Compression and streaming by Fraunhofer
- Almost 1,000,000 triangles at 50+ fps
X3DOM Examples
Animation & Interaction
- Ocean Drilling Rig
- 3D rendering by Fraunhofer
- Interactive Sun position and sky coloring
- Shadows
- HIgh detail
X3DOM Examples
Audio with animationed camera in a texture-rich environment
- "Siena Cathedral"
- Visuals developed by Fraunhofer
- Audio "Amicus Meus" composed by Tom�s Luis de Victoria (Spain, c.1548 – 1611)
- Audio integrated with visuals by Leonard Daly
WebVR and A-Frame
- WebVR is a W3C standard in development (latest draft 1 June 2016)
- Addresses Web-based VR devices, including sensors and displays
- Provide high-precision, low-latency interfaces in JavaScript
- Integrated with DOM
- Rendering from device-independent canvas
- A-Frame is a Mozilla effort for declarative 3D
- Built in tree structure
- Simplified nodes
- CSS-style attribute delarations
Device Movement
- Most all devices detect and capture some motion events
- Position
- Orientation
- Velocity
- Accelleration
- Resolution and accuracy for changes are not uniform across all motion categories
- Most accurate is Orientation
- All rotation angles are in degrees
Device Orientation
- Three angles are defined - alpha, beta, gamma
- Represent rotation from standard orientation
- Units are degrees
- Standard (Published, Latest)
Copyright © 2015 W3C® (MIT, ERCIM, Keio, Beihang). This software or document includes material copied from or derived from "DeviceOrientation Event Specification" - http://w3c.github.io/deviceorientation/spec-source-orientation.html
Device Rotations
Copyright © 2015 W3C® (MIT, ERCIM, Keio, Beihang). This software or document includes material copied from or derived from "DeviceOrientation Event Specification" http://w3c.github.io/deviceorientation/spec-source-orientation.html
See blog post Check Mobile Orientation for an interactive demonstration using mobile devices.
New Nodes
Credits
- Sienna Cathedral Visuals - Fraunhofer
- Sienna Cathedral Audio (XXX) - Amicus Meus (Public Domain)
- Ocean Drilling Rig - Fraunhofer
- Happy Budha - Fraunhofer
- Device rotation images
1 / 13