Tutorial Home / Web Page Integration

return to Tutorial Home

Overview

Web page integration involves embedding your 3D Synthetic Environment into a 2D web page design in order to enhance performance, usability, visual appeal and provide additional information to users.

Performance can be optimised by specifying a size (in pixels) for your embedded Synthetic Environment. On slower systems, the less the computer has to draw (ie. the fewer pixels) the faster the world will be.

Advanced techniques involve getting the VRML and scripts on the web page to communicate and share information with each other. With a combination of these web-based technologies pretty much any integrated multimedia experience can be created.

We won't be doing anything fancy here - simply embedding the VRML at a specified size on the page and disabling the default user interface in favour of the HUD we've already created.

back to top | return to Tutorial Home

Required Files

Download and unzip the following file (using WinZip) into the relevant folder of your working directory.

camera_package.zip (204Kb)

back to top | return to Tutorial Home

Tutorial

Open any text editor (like NotePad) or your favourite web design program.
Enter (or cut and paste) the following HTML exactly as shown. 
<html>

<head>
   <title>VRML Camera</title>
</head>

<body>
   <p align="center">
      <embed src="camera.wrl" width="500" height="400" VRML-DASHBOARD="FALSE">
      </embed>
   </p>
</body>

</html>
Save the file as camera.htm into the package folder.

Double-click on the file camera.htm to launch.

Here's the finished project.

back to top | return to Tutorial Home