Using the viewer on web pages

6.2. Using the viewer on web pages

The viewer is embedded in a web page using the standard <applet ...> tag. The most important applet tag parameters are width and height, which specify the size of the applet on the page. For example, the following tag defines the viewer to be inside a window sized 200 by 100 pixels...

<applet code="javaRenderer/JavaRenderer.class" codebase="model_files"
        archive="viewerb.jar, model.jar, model_0.jar, model_1.jar"
        width=200 height=100>
        <param name="model" value="model.123">
        <param name="lighting" value="smooth">
        ...
        </applet>

The parameters within the applet tag ("lighting" is shown in the example above) are used to control the default behaviour of the viewer, and are described in each of the sections below. For a complete example web page, run 3DSOM Pro and export a project and then look at the resulting HTML file.

The Java viewer applet, "viewerb.jar", is the same for all models, so it can be shared between multiple models or web pages. By default the viewerb.jar file is placed in a subdirectory with the model archive files. If you wish to share the viewer between multiple models move (or copy) this file into the parent directory and replace viewerb.jar with ../viewerb.jar. i.e.

<applet code="javaRenderer/JavaRenderer.class" codebase="model_files"
        archive="../viewerb.jar, model.jar, model_0.jar, model_1.jar"
        ...
        </applet>

(Note: Some older browsers only support the '../viewerb.jar' syntax for files on a web server not your local hard drive.)

The archive parameter specifies both the viewer and model JAR files, separated by a comma (do not use spaces in the archive filenames or path).

Initial model position and orientation

Figure 6.2.1. The camera

The image of the model seen in the applet window is generated as if looking through a camera centred on the origin of the world co-ordinate frame, looking backwards down the Z-axis. The grey area represents the field of view of the camera. Also shown is the bounding sphere around the object.

When the model is loaded, it is scaled so that it fits within a sphere of unit radius in world coordinates. The positionX, positionY and positionZ applet parameters give the initial position of the centre of this sphere in world coordinates defaulting to (0, 0, -3). This results in the model being placed centrally in the viewer window and roughly filling the window.

The positionZ applet parameter will set the initial depth of the model. Setting postitionZ to a value closer than the default (-3), such as -2, will make the model appear larger. A value further than the default, such as -6, will make the model appear smaller. Similarly the positionX and positionY parameters can be used to move the model horizontally and vertically within the window.

By default the centre of the model cannot be moved closer than Z = -2, or further than Z = -5. These limits of z-position may be altered using the nearZ and farZ applet parameters.

The initial orientation of the model is set by the orientation of the model when it was saved from 3DSOM Pro To set the orientation to a different value, use the orientationX, orientationY and orientationZ applet parameters. The direction of these values is shown in Figure 6.2.2.

Figure 6.2.2. Direction of the orientation parameters

The orientations are applied in the order X, Y then Z. The order that orientations are applied is critical, so bear this in mind if the final orientation is not what you expect and try changing one at a time.

Initial rotation

The rotateX and rotateY parameters can be used to apply an animated rotation to the model, as soon as it loads. These parameters are actually equivalent to dragging the mouse in the X and Y directions on the screen. Sensible values for these parameters are in the range -2 to +2.