We begin our tutorial with a basic example in which only one parameter, `INPUT`

, is passed to the applet. The value of this parameter is a string which describes the graphics to be displayed; in this case we have a line, a large red point and a smaller blue point. (Recall that you can review Mathematica's syntax for describing graphics objects.)

To create this applet on your computer system, download the file `live.jar`

from the "LiveGraphics3D Homepage" (Kraus) or from this article's list of accompanying files. In the same directory, create an HTML file with the following code. If you open the file in a web browser, you should see the same applet as the one displayed below.

**Resulting Applet**:

You should be able to rotate, spin, and change the zoom level in the image using the same controls as in the introduction. In this particular applet neither point can be dragged.

Equipped with the basic knowledge of how to embed LiveGraphics3D into a web page, we can start to construct the example from the introduction. First we'll create the wireframe mesh which represents a portion of the graph of

`z` = `f`(`x`, `y`) = 2 `y` `e`^{−x2−y2}

over the rectangle −1 ≤ `x` ≤ 3, −2 ≤ `y` ≤ 1

We used a 20 by 20 grid, which can be constructed using the following Mathematica commands. (For those who are unfamiliar with Mathematica and have not yet read the syntax overview, `Table[]`

is a variant of a `for`

-loop. Again, this could be mimicked using loops with another computer language.)

f[x_,y_]= 2y*Exp[-x^2-y^2];
xmin = -1; xmax = 3;
ymin = -2; ymax = 1;
n = 20;
dx = (xmax-xmin)/n;
dy = (ymax-ymin)/n;
mesh = {GrayLevel[0.7], (* Make the line segments gray, not black *)
(* This pair of nested Tables creates the cross sections y=j *)
Table[ (* Let the y-values vary *)
Table[ (* y fixed, now let x-values vary *)
Line[{{i, j, f[i, j]}, {i + dx, j, f[i + dx, j]}}],
{i, xmin, xmax - dx/2, dx}],
{j, ymin, ymax, dy}],
(* This pair of nested Tables creates the cross sections x=i *)
Table[ (* Let the x-values vary *)
Table[ (* x fixed, now let the y-values vary *)
Line[{{i, j, f[i, j]}, {i, j + dy, f[i, j + dy]}}],
{j, ymin, ymax - dy/2, dy}],
{i, xmin, xmax, dx}]
};

The variable `mesh`

now contains a long list of line segments which represent the wireframe mesh. Writing this list out would require about 50 kilobytes of text, which is more than we care to display in this article. Fortunately the input for LiveGraphics3D can be placed in a separate file. Within Mathematica, the easiest way to create the file is using the following function, which is included in the accompanying Mathematica notebook. To save space, it truncates decimal numbers before writing the object to the file `mesh.lg3d`

in the current working directory.

example = Graphics3D[mesh, Boxed -> False];
WriteLiveForm["mesh.lg3d", example]

To show the mesh in LiveGraphics3D, we use the `INPUT_FILE`

parameter instead of `INPUT`

:

The use of `INPUT`

or `INPUT_FILE`

is largely a personal preference for small amounts of data. For a large scene, an advantage of the `INPUT_FILE`

method is that the file can be stored into a ZIP archive; because the input consists of fairly repetitive text, the compression rate is typically very high, which results in much shorter download times for the input files. Another advantage is that certain characters can appear in an input file, but not in the value of the `INPUT`

parameter. For details, see the documentation at the LiveGraphics3D homepage.