This paper presents our experience creating X3DOM web publications of models and environments from four different domains: a Structure and Form Curriculum, Scientific Visualization, Homepage Designs, and Building Visualization. Through a series of six case studies across these domains, we highlight several tools and content pipelines using ISO Extensible 3D (X3D) and describe our experience publishing this content to X3DOM. We detail our lessons learned through these diverse use cases and show that a greatest common denominator exists. We hope these features and lessons contribute to the development of native Web3D graphics that leverage the standard scene graph and web-browser event systems such as the DOM.
We set out to demonstrate a capable platform to deliver interactive 3D publications from several tools and domains. Since we use the International Standards Organization (ISO) Extensible 3D (X3D) as our main platform for interchange and delivery of virtual environments and visualizations, we are able to view our content on diverse devices including: laptops, stereo TVs, walls of tiled screens and fully immersive projection rooms. This portability is very powerful in an IT- controlled environment where we can Copyright © 2012 for the individual papers by the papers' authors. Copying permitted only for private and academic purposes. This volume is published and copyrighted by its editors. count on specific client software being installed. But in the wild and out on the web, the required plug-in and stand-alone client models are less successful. To achieve the broadest possible reach for our interactive 3D content, we seek a way to publish to the native web browser. Extensible 3D (X3D), as a suite of ISO standard specifications, enables a number of flexible publishing paradigms for web and offline consumption [6, 7].
For the purposes of this paper specifically, we will describe our tests for X3DOM publication using data from several domains:
Since the ISO VRML and its EAI, declarative languages for scene graphs - 3D models, environments and interactions - have been widely demonstrated. These ISO scene graphs consist of a ‘Transformation Graph’, which represents the organization and coordinate systems of objects in the environment and a ‘Behavior Graph’, which describes the event connections between nodes. While the VRML or X3D files themselves are represented declaratively, most application logic is built from imperative programming languages. The APIs such as the ‘EAI’ or ‘SAI’ are exposing the runtime structure to programmatic access- whether its through JavaScript, Java, Python, C++, or.Net (name it here). Unlike its predecessor, the ISO Extensible 3D (X3D) standard provides both an abstract model of the scene graph encoded in several formats (XML, VRML-Classic, or Binary) and a programming interface, the SAI. The Scene Access Interface (SAI) may be implemented in any number of languages and the current ISO specs describe bindings for ECMAScript and Java. Considering recent developments in the Web Architecture, such as WebGL, there have been several innovative systems demonstrated to raise the content author’s abstraction from imperative OpenGL ES programming to more of a declarative, web-like, document-oriented model [2, 3, 8]. Integrating the behavior graph with the web event model provides a unified idiom within which to author rich, interactive 3D hypermedia. In this paper, we begin from the greatest common denominator information exchange that serves our enterprise across several domains (X3D). We then describe our initial experiences in publishing these resources to a native HTML5 web browser with WebGL: X3DOM. Each of these examples is posted online at:
We have developed a curriculum and toolset for architectural students to study the relationship between structure and form. The curriculum consists of two modules: a Knowledgebase website, which provides explanatory information and multimedia about different aspects of spatial structures, and the Structure And Form Analysis System (SAFAS).
Recent years have seen a remarkable exponential proliferation of information and services accessible over the World Wide Web. Because our goal was to publish our curriculum and tools for the broadest possible impact, we chose to use Web-based multimedia with Dublin-Core metadata as a means to publish explanatory resources in an accessible and searchable way [5,11]. SAFAS itself is based on the open-source Java toolkit, Xj3D [12]; here we describe the use of X3DOM to present assembly animations for the web curriculum described in [1].
The fundamentals of form and structure are presented in an explanatory resource, covering several main chapters and concepts. These include: Fundamentals, History, Design, Case Studies, and Assembly and Erection. In order to portray these concepts, a series of 3D models were built in 3D Studio Max. Videos were created and published with the website. Now the researchers are evaluating other e-publishing outlets for these models and animations. These include X3D and X3DOM. An initial set of modules was selected for animation, exported to X3D and then transcoded to X3DOM and HTML5. Screenshots are shown in Figure 1.
At the SuperComputing 2010 conference, a tutorial was given by members of Kitware, Sandia and Oak Ridge National Labs using Paraview, a multi-platform, open-source scientific visualization tool. The tutorial included the visualization of a single timestep dataset of pressure and temperature for a heated spinning disc. The tutorial developed color maps, contours, cutting planes, streamlines and glyphs from the data. We exported X3D from Paraview and used this model for testing several immersive display platforms in the VT Visionarium (Figure 2).
• • • The Fraunhofer IGD team connected the details on demand events to click the 3D model and show numeric temperature and update a graphic pointer on a 2D thermometer legend. This example is in on the X3DOM website under ‘Data Picking’.
In 1995, the National Oceanic and Atmospheric Administration (NOAA) created Science On a Sphere (SOS), a system designed to display visualizations projected onto a physical sphere of 68 inch diameter hanging in the middle of a large room. As of 2010, the system had been installed at 49 museums worldwide [4]. NOAA has worked to provide funding for installation and maintenance of SOS.
NOAA has made all SOS video datasets available for free, online. The SOS datasets are published as conventional MPEG-4 movie files but they are meant to be mapped to a sphere. Consequently, the spatial reality and impact of global features is reduced when the data is displayed in a 2D movie player. We developed a proof of concept that uses X3DOM to portray the videos. We selected three videos 2D Form and through 2D HTML elements provide control for: which video to load, which navigation style to be active, and a ‘reset view’ button. Video files were transcoded to OGG Theora for X3DOM publication. For the Reset View, we cloned the original viewpoint, created a new one and set the new copy to be bound using a javascript method we defined in the HTML page.
A screenshot is shown in Figure 3 and full details of our experiences for this application can be found in [9].
For a musican’s homepage, we developed a concept for a pwebsite that included several ‘floating’ 3D elements over the 2D webpage. Using the transparency of the X3D element through CSS, we overlayed the models using X3DOM,js and X3DOM.css. These included animations of wireframe 3D text, curved rotating geometry with alpha transparent PNGs, and a 3D pointSet of a guitar.
This is another example where ISO standard VRML and X3D serve as a powerful common denominator. We used the free tool from sourceforge, insight3D to process a set of 17 2D images of a guitar into a colored 3D point cloud that captures the main shape and features of the guitar. The point cloud was exported as VRML and converted to X3D. We animated it in translation, scale, and rotation. To add a more visual substance to the final presentation, we doubled the points and offset the second group in its translation so that they were easier for the eye to track. Figure 4 shows a screen shot of a page with an animated point cloud overlay (guitar).
• • • • • • • • • • • • • •
Also in the domain of homepage design, we built a world from several existing resources such as the Web3D logo and the X3DOM earth.png. Here again the Coordinates of an IndexedFaceSet were re-used for an IndexedLineSet. Both the mesh and polygon logos were animated to spin and in the case of the former, scale as well. Similarly to the example above, we spanned the X3DOM model overlay on top of several 2D elements, creating a striking pop-out effect. A screenshot is shown in Figure 5.
For this case, we added the attribute shadowIntensity=’0.7’ on the DirectionalLight. This computed dynamic shadows of the animated geometry on the ground platform. The platform ‘Box’, on which the earth.png was mapped, was converted to an IndexedFaceSet and refined (subdivided 3x by triangles) so that the shadow was computed and rendered with suitable resolution. Figure 5 shows a screenshot of the homepage.
Virginia Tech is currently building a new Center for the Arts, a sensor-rich, reconfigurable performance space that will blend art and engineering in novel ways. In preparation for its ground breaking, the architecture firm Snohetta provided an exterior 3D model of the building and locale. These files were processed by the VT School of Visual Arts to X3D. We exported X3D from Modo and used this model for testing several immersive display platforms in the VT Visionarium.
For web publication, we down-sampled (bicubic) the 2048 2 textures to 1024. We did not reduce the Coordinate precision of the source model. This environment was processed successfully to X3DOM and although still heavy (8 MB world, 12 MB textures), it ran quite smoothly on a 2010 era, mid-range laptop. Figure 6 shows a large-format rendering of the VT Center for the Arts. emissiveColor on Materials might need to be removed from model
Extensible 3D (X3D) provides the interoperability, portability, and durability that is the greatest common denominator for ‘Enterprise 3D IT’. Across six use cases and four domains, the ISO standard for declarative scene graphs, X3D, provides a capable greatest common denominator for interactive 3D communication. The clear mapping of worlds published to X3D or X3DOM opens a huge opportunity for the publication of 1st class, native, interactive virtual environments on the web. While the X3DOM node set and event semantics are different from the ISO X3D Interactive Profile, automatic transcoding provides a clean mapping to the X3DOM tag set.
The W3C Declarative 3D Community Group is the center of this design and development evolution. We have opened Pandora’s Box to Deep Media on the web. Now web developers can author interactive 3D web environments and applications in their idiomOpenGL and WebGL expertise is not needed. As X3DOM proves, CSS and the scripting basis of HTML 5 can align with proven scene graph structures. Clearly, native Web3D web clients that share declarative scene graphs and manage these information objects through a common Document Object Model (DOM) is a reality.
This set of case studies gives proof to the question that a greatest common denominator for interactive 3D (X3D) can be aligned with recent W3C standards such as HTML5. Further integrating with sensor models and 2D graphic standards is the next step for X3D, perhaps as a new Profile (formalized node set) that lives comfortably on top of WebGL and dovetails with the event systems underwriting the web information ecology. 4. 5. 1. BACIM, F., POLYS, N., CHEN, J., SETAREH, M., LI, J., AND MA, L. “COGNITIVE SCAFFOLDING IN WEB3D LEARNING SYSTEMS: A CASE STUDY FOR FORM AND STRUCTURE”. IN PROCEEDINGS OF THE 15TH INTERNATIONAL CONFERENCE ON WEB 3D TECHNOLOGY (LOS ANGELES, CALIFORNIA, JULY 24 - 25, 2010). WEB3D '10. ACM, 2010. 2. JOHANNES BEHR, PETER ESCHLER, YVONNE JUNG, AND MICHAEL ZOLLNER. 2009. X3DOM: A DOM-BASED HTML5/X3D INTEGRATION MODEL. IN PROCEEDINGS OF THE 14TH INTERNATIONAL CONFERENCE ON 3D WEB TECHNOLOGY (WEB3D '09), STEPHEN N. SPENCER (ED.).
ACM, NEW YORK, NY, USA, 127-135. 3. JOHANNES BEHR, YVONNE JUNG, TIMM DREVENSEK, AND ANDREAS ADERHOLD. 2011. DYNAMIC AND INTERACTIVE ASPECTS OF X3DOM. IN PROCEEDINGS OF THE 16TH INTERNATIONAL CONFERENCE ON 3D WEB TECHNOLOGY (WEB3D '11). ACM, NEW YORK, NY, USA, 81-87.
GOLDMAN, K., KESSLER, C., AND DANTER, E. 2010. SCIENCE ON A SPHERE : CROSS-SITE SUMMATIVE EVALUATION. INSTITUTE FOR LEARNING INNOVATION.
NATIONAL SCIENCE DIGITAL LIBRARY WWW.NSDL.ORG 6. POLYS, NICHOLAS F. “PUBLISHING PARADIGMS WITH X3D” IN: INFORMATION VISUALIZATION WITH SVG AND X3D, (EDS.) CHANOMEI CHEN AND VLADIMIR GEROIMENKO, SPRINGER-VERLAG, 2005.
NICHOLAS F. POLYS, MICHAEL SHAPIRO, AND KAREN DUCA. 2007. IRVE-SERVE: A VISUALIZATION FRAMEWORK FOR SPATIALLY-REGISTERED TIME SERIES DATA. IN PROCEEDINGS OF THE TWELFTH INTERNATIONAL CONFERENCE ON 3D WEB TECHNOLOGY (WEB3D '07). ACM, NEW YORK, NY, USA, 137-145.
KRISTIAN SONS, FELIX KLEIN, DMITRI RUBINSTEIN, SERGIY BYELOZYOROV, AND PHILIPP SLUSALLEK. 2010. XML3D: INTERACTIVE 3D GRAPHICS FOR THE WEB. IN PROCEEDINGS OF THE 15TH INTERNATIONAL CONFERENCE ON WEB 3D TECHNOLOGY (WEB3D '10). ACM, NEW YORK, NY, USA, 175-184.
DAN TILDEN, ANKIT SINGH, NICHOLAS F. POLYS, AND PETER SFORZA. 2011. MULTIMEDIA MASHUPS FOR MIRROR WORLDS. IN PROCEEDINGS OF THE 16TH INTERNATIONAL CONFERENCE ON 3D WEB TECHNOLOGY (WEB3D '11).
ACM, NEW YORK, NY, USA, 155-164. 10. WEB3D CONSORTIUM WWW.WEB3D.ORG 11. WORLD WIDE WEB CONSORTIUM WWW.W3C.ORG 12. XJ3D: WWW.XJ3D.ORG