You are here

Constructing Mathlets Quickly using LiveGraphics3D - LiveGraphics3D Input

Jonathan Rogness and Martin Kraus

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.jarfrom 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 ex2y2

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.lg3din the current working directory.

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

To show the mesh in LiveGraphics3D, we use the INPUT_FILEparameter instead of INPUT:

The use of INPUTor INPUT_FILEis largely a personal preference for small amounts of data. For a large scene, an advantage of the INPUT_FILEmethod 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 INPUTparameter. For details, see the documentation at the LiveGraphics3D homepage.

Jonathan Rogness and Martin Kraus, "Constructing Mathlets Quickly using LiveGraphics3D - LiveGraphics3D Input," Convergence (May 2006)