HTML Object Tag for X3D

The following examples show how to place an X3D object within an HTML page.

The left column shows what is displayed when an X3D plugin is installed (if one is installed).
The center column shows what is displayed if no X3D plugin is installed.
The right column shows the HTML source.

X3D plugin object (if installed)	No X3D plugin installed	HTML source
Online example scene:	Anchor-link text backup:
	Select an X3D plugin to see this example...	<html> <body> <object data="http://www.web3d.org/x3d/content/examples/HelloWorld.x3d" type="model/x3d+xml" height="360" width="300"> <param name="src" value="http://www.web3d.org/x3d/content/examples/HelloWorld.x3d"/> <param name="DASHBOARD" value="FALSE"/> <param name="SPLASHSCREEN" value="FALSE"/> <!-- the following anchor-link text is only shown if no X3D plugin is already installed --> <div class="noX3dPluginInstalled"> <a href="http://www.web3d.org/x3d/content/examples/help.html#Applications" target="helpPage"> Select an X3D plugin to see this example...</a> </div> </object> </body> </html>
Online example scene:	Anchor-link image backup:
		<html> <body> <object data="http://www.web3d.org/x3d/content/examples/HelloWorld.x3d" type="model/x3d+xml" height="360" width="300"> <param name="src" value="http://www.web3d.org/x3d/content/examples/HelloWorld.x3d"/> <param name="DASHBOARD" value="FALSE"/> <param name="SPLASHSCREEN" value="FALSE"/> <!-- the following anchor-link image is only shown if no X3D plugin is already installed --> <div class="noX3dPluginInstalled"> <a href="http://www.web3d.org/x3d/content/examples/help.html#Applications" target="helpPage"> <img src="HelloWorld.tall.png" height="360" width="300" alt="Click image to select an X3D plugin" /> </a> </div> </object> </body> </html>

Design notes

The X3D scene url may be absolute (as shown above) or relative.
The HTML template page newHtmlPageWithX3dObject.html is an example HTML scene with an X3D object tag included. This is a good example for authors to copy, edit and reuse.
Another candidate pick-a-browser resource is the Web3D Consortium X3D Viewers, Browsers & Plug-ins page, online at http://www.web3d.org/tools/viewers_and_browsers.
Use of the classid attribute needs to be avoided, since it restricts display of the X3D scene to only one specific browser, regardless of whatever X3D plugin might already be installed.
Each browser plugin typically has additional <param> options which allow further customization, and usually forces that particular plugin to be used. Be careful to avoid breaking compatibility among multiple browswers when using such options.
TODO for browser companies: the <param name="src" value="...same url as data attribute..." /> entry appears to be redundant and may be eliminated once X3D plugins get more consistent.
The relevant HTML Specification references are 13.3 Generic inclusion: the OBJECT element and 13.3.2 Object initialization: the PARAM element.
Extensible 3D (X3D) MIME Types describes proper configuration of http servers, online at http://www.web3d.org/x3d/learn/mimetypes.
Further information is available on the X3D Examples Help and X3D Scene Authoring Hints pages. Note that all of the scene pages in the X3D Examples use the design pattern described on this page.
TODO: examining whether browser-setup Scene Access Interface (SAI) parameters might be passed via <param> name-value pairs.

Acknowledgements

Thanks to X3D/HTML experts Joe Williams (Hypermultimedia) and Leonard Daly (Daly Realism) for their help troubleshooting this design pattern among multiple X3D browsers.

Contact

Questions, suggestions and comments about these resources are welcome. Please send them to Don Brutzman (brutzman at nps.navy.mil)

Available online at http://www.web3d.org/x3d/content/examples/HtmlObjectTagForX3d.html

Revised: 31 December 2007