Use JSP to create your own VRML world

VRML lets you produce 3-D worlds that are accessible via a browser. See how you can combine this technology with JSP to create a memorable user experience.

Virtual Reality Modeling Language (VRML) is a simple text language for describing 3-D shapes. Users interact with 3-D shapes, textures, sound, and animation. Java Server Pages (JSP) is a tool for generating dynamic responses to just about any type of browser. Users typically interact with databases, enterprise systems, and Web servers. In this tutorial, you'll see how VRML and JSP can interact, combining the world of rich animation and 3-D shapes with databases and Internet or intranet applications. We'll start with a look at the processes involved.

Figure A shows a standard request process—the page is requested via a browser. The request calls the designated JSP, which interacts with a database. The example we'll look at here follows this model.

Figure A
Request process

After receiving the response, the system follows the flow shown in Figure B. The database sends the requested data to the JSP, which formats the data and sends the response to the requesting browser. In our example, the data is returned to the JSP, which generates a VRML scene using the data from the database.

Figure B
Response process

Our examples have been tested on a Tomcat server, configured to use JDK 1.31, but they're standard—they'll work just as well on the Java Web Server or any other JSP Web server (JDK 1.2 or higher). The database functionality has been tested on the Microsoft SQL Server 2000 and Oracle8i database servers. I used the Cortona VRML browser.

Server setup
For the JSP application to return VRML in a way that is understandable by the browser, the Web server needs to be configured with the correct MIME extension. VRML files end with .wrl and are of type x-world/x-vrml. Here is an extract from Tomcat’s web.xml file:

It is quite likely that the Web server has already been set up with the correct MIME extension, as was the case with the Tomcat installation used to test the examples.

If a browser does not present the output of your JSP, I recommend using two browsers—one with the VRML client installed and one without. I had my VRML browser installed on Internet Explorer and did my JSP debugging through Netscape.

Source files
To show you the type of effect you can achieve with VRML and JSP, we've set up a sample demo, which relies on the following files:
  • ·        Sphere.wrl contains a VRML sphere example.
  • ·        Create.wrl shows another way of getting VRML to talk to JSP.
  • ·        Db.jsp is a JSP that connects to a database to retrieve data that will dynamically create the spheres.
  • ·        Create2.wrl and db2.jsp are more complex examples of the technique demonstrated in create.wrl.

Combining JSP and VRML headers
On most servers, JSP is quite forgiving when it comes to headers. On the other hand, VRML browsers complain bitterly when the correct syntax is not present on the first line of the header.

The server strips all JSP code when sending a response. So, on lines where only JSP code is present, the server simply sends blank lines back to the browser. This means that if we start the JSP file with only <%@ page language="java" %>, the VRML browser may not be able to correctly display the page and could report an error instead.

If it's necessary to include both JSP and VRML headers, put the headers on the same line, as follows:
<%@ page language="java" %> #VRML V2.0 utf8

Now, the content type must be changed before we set the VRML header, so the final result looks like this:
<%@ page language="java" %><%response.setContentType("x-world/x-vrml");%>#VRML V2.0 utf8

VRML sphere
The objective of our example is to display a VRML shape: a sphere. Here is the VRML code for the sphere:
DEF sphere Transform  {
translation 0 0 0
children [
Shape {
appearance Appearance {
material Material {
diffuseColor 1 1 1
} }
geometry Sphere {
radius 1
} } ] }

JSP scripting is added to this shape, which lets us use dynamic data to change the sphere’s position in space (translation X Y Z), its color (diffuseColor R G B), and its radius. Listing A contains the complete source code of sphere.wrl. Listing B contains the create.wrl file, which uses JSP and database connectivity to set up the VRML.


The database table
I created a table called spheres and set up the data as shown in Table A.
Table A
 id  color radius
1 1
2 2
3 3
4 4

As you can see, the first sphere starts out quite dark (0.1 0.1 0.2), and successive spheres get lighter, with the fourth sphere being the lightest (0.4 0.4 0.8).

Camera view
I added a default viewpoint for the world—facing the camera a comfortable distance away from the spheres:
position      20 0 50
orientation   1 0 0 -0.1
description        "Entry"

The viewpoint is located 50 away from the spheres and translated 20 along the x-axis, so that all of the spheres fit correctly onto the page.

A database connection is used so that the proper package is imported (Java.sql.*).
<%@ page import="java.sql.*" %>

Here are the strings used to connect to the Oracle database:
String driver = "oracle.jdbc.driver.OracleDriver";
String dburl  = "jdbc:oracle:thin:@faustus:1521:intra";
String dbuid = "spheres";
String dbpwd = "spheres";

The SQL in this case is quite simple—return all data contained in the table:
String sql = "SELECT * FROM spheres";

Once the resultSet is assembled, the code loops through all of the records and displays as many spheres as there are records in the database. This is the loop:
int count = 0;
while( {
color = rs.getString("color");
radius = rs.getString("radius");
DEF sphere<%=count%> Transform {
translation <%=count*15%> 0 0
children [
Shape {
appearance Appearance {
material Material {
diffuseColor <%=color%> }
geometry Sphere {
radius <%=radius%>
} } ] }

Notice how the values from the database are inserted into the VRML. Two strings, color and radius, are set to the values from the database and then displayed in the VRML code as <%=color%> and <%=radius%>.

The translation is handled by an integer (count), which keeps track of the number of records and displaces the sphere by 15 on the x-axis every iteration of the loop.

The variable count has another use. As we generate sphere objects, we give them a name: DEF sphere1, DEF sphere2, and so on. We do this by inserting the count into the VRML node’s definition
DEF sphere<%=count%>

Listing C contains the complete listing of db.jsp.

Another way to integrate JSP and VRML
Perhaps a world has already been set up as a VRML (.wrl) file and you would like to add some dynamic functionality without converting it to a JSP. The solution makes use of VRML scripting:
DEF grp Group{}
Script {
field SFNode group USE grp
url "javascript:
function initialize() {
urlString = new MFString('db.jsp');
Browser.createVrmlFromURL(urlString, group, 'addChildren');
} " }

This VRML script (Listing D) collects the response from a JSP and stores it in a string. It then calls the Browser.createVrmlFromURL function, using the string as a parameter. The function adds whatever is returned from the JSP to the group node. The group node (grp) is displayed in the VRML world, and so are its contents.

Now, communication is established between the VRML scripting and the JSP to create a truly dynamic display. The easiest way to do this is to use GET to pass parameters to the JSP. Note how the parmString is set up. It could contain just about any information that needs to be sent to the JSP.

The JSP accepts the argument as follows (the complete code is available in Listing E):
int sp = 4;
if (request.getParameter("sp") != null)
sp = Integer.parseInt(request.getParameter ("sp"));

If the loop condition is altered to read while( && count < sp), it limits the number of spheres displayed, depending on the parameter we send from the VRML script.

Create your own world
We've examined two ways to integrate JSP and VRML. The first technique uses a JSP to generate the VRML dynamically. The second uses a VRML script to call a JSP, which returns dynamic VRML. These techniques facilitate the creation of custom 3-D worlds that provide a memorable user experience.

Editor's Picks