The MetaViewApplet displays SAS metagraphics data as interactive graphics in your Web browser window. Metagraphics data is a special output format produced by SAS/GRAPH software. Any SAS/GRAPH procedure that can create a GRSEG as output can also create an exact replica of that output in metagraphics format.

• Software Requirements
• MetaViewApplet Features
• Developing Applications with the MetaViewApplet
• Using the MetaViewApplet
• Coding Examples

Software Requirements

The MetaViewApplet is available with Version 8 or later of SAS/GRAPH Software, and with the CGI Tools for the Web Server package (websrv).

SAS/GRAPH software is needed to create the metacode files.

To use the applet, a user must have a Web browser capable of supporting Version 1.02 of the Java Development Kit (JDK). The suggested browsers include

• Netscape Communicator 4.04 (with the JDK 1.1 patch) or higher
• Microsoft Internet Explorer 4.72 or higher.

Note: Java support varies across browsers. 

MetaViewApplet Features

• The graphs displayed by this applet are exact replicas of the corresponding GRSEGs.
• The graphs support user interaction:
  • resizing the graph (while maintaining aspect ratio)
  • scrolling back and forth among graphs using embedded controls
  • animated scrolling (slide show presentation)
  • drill to other graphs without loading a new HTML page
  • display of data tips via mouse-over events.
• The MetaViewApplet has several programmable features:
  • flexibility to include the metacodes within the HTML or to store them as external files which can be loaded by the applet on request
  • application-defined text for data tips
  • application-defined pop-up menus
  • application-defined drill targets (other metacode files or URLs)
  • optional display of embedded applet controls (sliders, comboboxes, etc.) that enable a user to resize graphs, scroll among graphs, or select a graph.

Developing Applications with the MetaViewApplet

Developing web-based applications with the MetaViewApplet requires two levels of programming:

1) Using DEVICE=JAVAMETA with SAS/GRAPH procedures or DSGI to create the metagraphics data (metacodes).

2) Creating an HTML file on a web server.

Although you always use SAS/GRAPH to generate the metagraphics data for your graphs, you have two choices for creating the HTML file:

• You can create the output HTML file yourself with a text editor or using PUT statements in your SAS program.
• Beginning with Release 8.1 of SAS/GRAPH, you can use the Output Delivery System (ODS) in your SAS program and let ODS create the HTML file for you.

Using DEVICE=JAVAMETA without ODS requires you to create the HTML file yourself. This gives you more control over the HTML tagging and enables you to take advantage of all of the MetaViewApplet's features.

Using DEVICE=JAVAMETA with ODS makes it easy to display graphs with the MetaViewApplet because it creates the required HTML file for you. However, ODS generates a separate set of metacodes for each graph and always writes the codes into the HTML file. Thus, as shown in the following table, some MetaViewApplet features are not accessible through ODS-generated HTML files.

Features	Why not available in ODS-generated HTML
Scrolling back and forth among graphs using embedded controls Animated scrolling (slide show presentation)	Requires the SAS/GRAPH program to write multiple graphs to a single set of metacodes
Storing metacodes as external files that can be loaded by the applet on request Using metacode files as targets for drill-down graphs or menu items	Requires the SAS/GRAPH program to write metacodes to external ascii files

Coding Examples

The examples below show how to use DEVICE=JAVAMETA with and without ODS.

Using DEVICE=JAVAMETA Without ODS

• Example 1: Basic coding to display SAS/GRAPH output
• Example 2: Creating and accessing multiple metacode files
• Example 3: Creating and displaying data tips
• Example 4: Creating a drill-down graph
• Example 5: Streaming metacodes in a batch program
• Example 6: Building metacode files in a batch program

• Example 7: Basic coding to display SAS/GRAPH output using ODS
• Example 8: Creating and displaying data tips using ODS
• Example 9: Creating and displaying menus using ODS
• Example 10: Creating a drill-down graph using ODS

Example 1: Basic coding to display SAS/GRAPH output without ODS

The GTESTIT procedure outputs three "sets" of metacodes by default, one for each output GRSEG.

    /* Assign reserved fileref for metacodes */
    filename _webout 'gtestit.txt';

    /* Use JAVAMETA device driver to create graphics metadata */
    goptions dev=javameta;
    proc gtestit;
    quit;

    /* Deassign fileref */
    filename _webout;

Notes:

1) _WEBOUT is a reserved fileref required by the JAVAMETA SAS/GRAPH device driver when it is not used with ODS. When this fileref is assigned to some file, the JAVAMETA driver opens the file in APPEND mode and writes the contents of graphics output in metacode format to the file. This is a simple ASCII file and does not require any special file extension. If you rerun this program be sure to delete the previous output file, so the new metacodes are not appended.

2) The resulting metacodes file should not be edited in any way.

The other part of the programming involves setting up the necessary files on a web server:

• The Java archive file METAFILE.ZIP must be copied to some location on the web server (all of the non-ODS examples use a web server path of web_server_name/sasweb/graph, but there is nothing special about this path name). METAFILE.ZIP is included with all installations of SAS/GRAPH software. It resides in the file path indicated by the SAS System option APPLETLOC. (Run PROC OPTIONS or view the SAS configuration file to find the value of APPLETLOC.)
• Copy the metacodes file GTESTIT.TXT to some application directory on the web server, such as /sasweb/graph/javameta/gtestit.txt.
• Create an HTML file in the same application directory to display the graphs stored in the metacodes. Here is the minimal HTML markup coding necessary:

Contents of http://web_server_name/sasweb/graph/javameta/example1b.html

<html>
<head>
<title> MetaViewApplet Example 1: Basic coding to display SAS/GRAPH output </title>
</head>
<body>
<applet archive="http://web_server_name/sasweb/graph/metafile.zip"
   code="MetaViewApplet.class"
   width="640" height="480" align="TOP">

   <param name="BackgroundColor" value="0xffffff">
   <param name="Metacodes" value="http://web_server_name/sasweb/graph/javameta/gtestit.txt">

   Sorry, your browser does not support the applet tag
</applet>
</body>
</html>

Notes:

1) ARCHIVE= indicates where the required Java classes are stored.
2) CODE= indicates the specific class for this Applet.
3) WIDTH=, HEIGHT=, and ALIGN= control size and position of the applet.
4) PARAM attributes contain name/value pairs that configure the applet.
5) The text Sorry,... appears whenever the user's browser cannot display the Java applet.

In Version 8.00, the Output Delivery System (ODS) CANNOT be used to create the HTML output file directly (as when using DEVICE=JAVA). However, ODS support for DEVICE=JAVAMETA was implemented for Release 8.1. ODS eliminates the need to manually construct the HTML files shown in these examples. Example 7 shows how to use ODS with the DEVICE=JAVAMETA. Examples 8 to 10 show more complete examples.

An alternative to maintaining a separate file for the metacodes is to include them "inline" by copying the contents of GTESTIT.TXT as the value of the METACODES parameter:

<html>
<head>
<title>MetaViewApplet Example 1: Basic coding to display SAS/GRAPH output</title>
</head>
<body>
<applet archive="http://web_server_name/sasweb/graph/metafile.zip"
   code="MetaViewApplet.class"
   width="640" height="480" align="TOP">

   <param name="BackgroundColor" value="0xffffff">
   <param name="Metacodes" value="
   37    8  106   97  118   97  109  101  116   97   30    0   10    1   13    5
    0    0    0   50    8   32   32   32   32   32   32   32   32   51   16   56
   46   48   48   46   48   48   77   48   68   48   57   50   49   57   57   52
    0   54    0   56    1   62    1   63    0    0   64   51   33   65 2408 1785
   (remaining metacodes)
  ">

   Sorry, your browser does not support the applet tag
</applet>
</body>
</html>

The display of http://web_server_name/sasweb/graph/javameta/example1b.html:

The MetaViewApplet displays SAS metagraphics data as interactive graphics in your Web browser window. The display area of MetaViewApplet contains two sections:

1) An upper area for displaying the graph(s)

2) A lower area containing controls for manipulating the graphs. These controls are optional and are enabled or disabled by the PARAM attributes for the applet.

Use the applet's pop-up Help menu (right-click) for information on what these controls do and how to use them.

Example 2: Creating and accessing multiple metacode files

You can display different metacode files from the MetaViewApplet. This requires some preprocessing of the data before creating the graphs.

In this example, two metacode files are created, each containing four graphs. The applet will display two controls: one for selecting a set of graphs and the other for scrolling within the set.

   /* Summarize the data - one observation per
      YEAR*QUARTER*COUNTRY*PRODUCT combination */
   proc summary data=sashelp.prdsale nway;
      class year quarter country product;
      var actual predict;
      output out=prdsummary sum=actual;
   run;

   /* Use JAVAMETA device driver to create graphics metadata */
   goptions reset=all border dev=javameta
            colors=(blue yellow red cyan green) ctext=black
            ftext="Helvetica" ftitle="Helvetica"
            htext=24 pt htitle=32 pt ;

   /* Create four charts in Y1993.TXT */
    filename _webout "y1993.txt";
    title1 '1993 Sales';
    proc gchart data=prdsummary(where=(year=1993));
       hbar3d country / sumvar=actual subgroup=product sum
          shape=hexagon caxis=black cframe=ltgray;
       by quarter;
   run;
   quit;

   /* Create four charts in Y1994.TXT */
   filename _webout "y1994.txt";
   title1 '1994 Sales';
   proc gchart data=prdsummary(where=(year=1994));
       hbar3d country / sumvar=actual subgroup=product sum
          shape=hexagon caxis=black cframe=ltgray;
       by quarter;
   run;
   quit;
   filename _webout;

Contents of http://web_server_name/sasweb/graph/javameta/example2.html

<html>
<head>
<title>MetaViewApplet Example 2:  Creating and accessing multiple metacode files</title>
</head>
<body>
<applet archive="http://web_server_name/sasweb/graph/metafile.zip"
   code="MetaViewApplet.class"
   width="640" height="480" align="TOP">

   <param name="BackgroundColor" value="0xffffff">
   <param name="ZoomControlEnabled" value="false">
   <param name="SlideShowControlEnabled" value="false">

   <param name="Metacodes" value="http://web_server_name/sasweb/graph/javameta/y1993.txt">
   <param name="Metacodes1" value="http://web_server_name/sasweb/graph/javameta/y1994.txt">
   <param name="MetacodesLabel" value="1993">
   <param name="Metacodes1Label" value="1994">

   Sorry, your browser does not support the applet tag
</applet>
</body>
</html>

Notes:

1) You can supply multiple metacode parameters for the applet, each specifying a set of metacodes.

2) The sets of metacodes could be placed "inline" as in Example 1, eliminating the need for separate metacode files.

3) The set of metacodes specified by the MetaCodes parameter is initially loaded. Other sets are loaded only upon user selection.

The display of http://web_server_name/sasweb/graph/javameta/example2.html:

The combobox displays the text specified by the values for MetaCodesLabel and MetaCodes1Label parameters in the HTML.

When a year is selected, the associated set of metacodes is loaded.

The Page Control slider is used to scroll through the graphs within each set of metacodes.

Example 3: Creating and displaying data tips

Data tips are text boxes that appear in an application when a user passes the mouse pointer over some area. The MetaViewApplet has no default display of data tips, but can display application-defined data tips. To use this feature, you must do some additional processing of the data before creating the graphs.

In this example, a bar chart with independent variable PRODUCT and subgroup variable YEAR is created. The summarized values for each subgroup will be displayed upon a mouse-over event.

   /* Summarize the data - one observation per PRODUCT*YEAR combination */
   proc summary data=sashelp.prdsale nway;
      class product year;
      var actual;
      output out=prdsummary sum=actual;
   run;

   /* Post-process the summarized data to add an HTML variable
      holding the text for the data tips - one unique tip per subgroup.
      TIP= is a keyword. */
   data prdsummary;
      set prdsummary;
      length htmlvar $100;
      htmlvar='tip=['||
              quote('Product  '||trim(product))
              ||' '||
              quote('Year       '||put(year,4.))
              ||' '||
              quote('Actual     '||trim(left(put(actual,dollar10.2))))
              ||']';
   run;

   /* Use JAVAMETA device driver to create graphics metadata */
   goptions reset=all border dev=javameta
            colors=(blue yellow red cyan) ctext=black
            ftext="Helvetica" ftitle="Helvetica"
            htext=24 pt htitle=32 pt;

   /* The IMAGEMAP= and HTML= options add the data tips to the
      metagraphics data. */
   title1 'Actual Sales by Product';
   proc gchart data=prdsummary imagemap=temp;
      hbar3d product / sumvar=actual subgroup=year sum
                       shape=hexagon caxis=black cframe=ltgray
                       html=htmlvar;
   run;
   quit;

Notes:

1) Because ODS is not used to generate the output HTML file, the IMAGEMAP= statement is required to create a utility SAS data set that contains information about the graph and about areas in the graph. This information includes the shape and coordinates of the areas, and is used to build the metacodes that links the graph areas to other files (drill-down), data tips and pop-up menus. If ODS were used, it creates this information for you and the IMAGEMAP= option would be omitted.

2) Whether or not ODS is used, the HTML= option is required to indicate which variable stores information about drill-down actions, data tips, or popup menus.

3) See formatting the HTML= variable for how to build strings for data tips, pop-up menus, and drill-down functionality.

Contents of http://web_server_name/sasweb/graph/javameta/example3.html

<html>
<head>
<title>MetaViewApplet Example 3: Creating and displaying data tips</title>
</head>
<body>
<applet archive="http://web_server_name/sasweb/graph/metafile.zip"
   code="MetaViewApplet.class"
   width="640" height="480" align="TOP">
   <param name="DataTipStyle" value="STICK">>
   <param name="BackgroundColor" value="0xffffff">
   <param name="Metacodes" value="
   37    8  106   97  118   97  109  101  116   97   30    0   10    1   13    5
    0    0    0   50    8   32   32   32   32   32   32   32   32   51   16   56
   46   48   48   46   48   48   77   48   68   48   57   50   49   57   57   52
   (remaining metacodes)
  ">

   Sorry, your browser does not support the applet tag
</applet>
</body>
</html>

Note:

Assigning STICK to the DataTipStyle parameter causes the data tip text box to track the mouse pointer as it moves over a graphical segment. The tip of the mouse pointer is connected to the box with a line.

The display of http://web_server_name/sasweb/graph/javameta/example2.html:

Whenever the active set of metacodes contains only one graph, the Page and Slide Show controls do not appear.

The data tip text changes for each subgroup value of each bar, corresponding to the values created for the HTML variable.

To remove the Zoom control, specify 
<param name="ZoomControlEnabled" value="false">
in the HTML.

Example 4: Creating a drill-down graph

You can also use HTML= variable to associate "actions" with graphical areas, such that a click on the graphical area causes the action to occur. These actions include displaying another web page or loading a set of metacodes.

In this example, a pie chart with independent variable YEAR is initially displayed. Clicking on a pie slice causes another pie chart to be displayed with an independent variable of QUARTER. 

   /* Summarize the data by YEAR, QUARTER and YEAR*QUARTER */
   proc summary data=sashelp.prdsale;
     class year quarter;
     var actual;
     output out=prdsummary sum=actual;
   run;

   %let htmlpath=http://web_server_name/sasweb/graph/javameta;

   /* Post-process the summarized data to create the HTML variable
      holding the text for the drill-down. MREF= is a keyword. */
      data yearsonly;
      set prdsummary(where=(_type_ eq 2));
      length htmlvar $200;
      htmlvar='mref='||quote("&htmlpath/y"||put(year,4.)||'.txt');
   run;

   /* Use JAVAMETA device driver to create graphics metadata */
   goptions reset=all dev=javameta
            colors=(blue yellow red cyan) ctext=black
            ftext="Helvetica" ftitle="Helvetica"
            htext=24 pt htitle=32 pt ;

   /* The IMAGEMAP= and HTML= options add the MREF values to the
      metagraphics data */
   filename _webout "allyears.txt";
   title1 '1993-1994 Sales';
   proc gchart data=yearsonly imagemap=temp ;
   pie3d year / sumvar=actual  discrete nolegend value=arrow slice=arrow
                html=htmlvar;
   run;
   quit;

   /* Create the drill-down graphs */
   filename _webout "y1993.txt";
   goptions colors=(red cyan tan ltgray);
   title1 '1993 Quarterly Sales';
   proc gchart data=prdsummary (where=(year eq 1993 and _type_=3));
      pie3d quarter / sumvar=actual discrete nolegend value=arrow slice=arrow;
   run;
   quit;

   filename _webout "y1994.txt";
   goptions colors=(red cyan tan ltgray);
   title1 '1994 Quarterly Sales';
   proc gchart data=prdsummary (where=(year eq 1994 and _type_ eq 3));
      pie3d quarter / sumvar=actual discrete nolegend value=arrow slice=arrow;
   run;
   quit;

   /* Deassign fileref */
   filename _webout;

Notes:

1) Because ODS is not used to generate the output HTML file, the IMAGEMAP= statement is required to create a utility SAS data set that contains information about the graph and about areas in the graph. This information includes the shape and coordinates of the areas, and is used to build the metacodes that links the graph areas to "actions" (drill-down), data tips and pop-up menus. If ODS were used, it creates this information for you and the IMAGEMAP= option would be omitted.

2) Whether or not ODS is used, the HTML= option is required to indicate which variable stores information about drill-down actions, data tips, or popup menus.

3) See Formatting the HTML= variable for information on how to build strings for data tips, pop-up menus, and drill-down actions.

4) The files allyears.txt, y1993.txt, and y1994.txt must be transferred to a web server.

Contents of http://web_server_name/sasweb/graph/javameta/example4.html:

<html>
<head>
<title> MetaViewApplet Example 4: Creating a drill-down graph</title>
</head>
<body>
<applet archive="http://web_server_name/sasweb/graph/metafile.zip"
   code="MetaViewApplet.class"
   width="640" height="480" align="TOP">

   <param name="ZoomControlEnabled" value="FALSE">
   <param name="BackgroundColor" value="0xffffff">
   <param name="Metacodes" value="http://web_server_name/sasweb/graph/javameta/allyears.txt">

   Sorry, your browser does not support the applet tag
</applet>
</body>
</html>

The display of http://web_server_name/sasweb/graph/javameta/example4.html:

The user can select either slice to see another graph showing the breakdown of sales by quarter.

When MREF= or MTAG= is used to specify the drill-down action, an automatic pop-up menu containing an item for Back is created for the "child" set of metacodes. Selecting Back enables the user to return to the "parent" of the drill-down selection.

When HREF= is used to specify a drill-down action, a new web page is opened. There is no pop-up menu defined for it.

Example 5: Streaming metacodes in a batch program

Even without ODS, you can write a SAS program to create the HTML file containing an entire MetaViewApplet application.

This example is an extension of Example 1. It shows how to create a batch SAS program that writes an HTML file containing the MetaViewApplet and embedded graphical metacodes. The output file (example5.html) must be transferred to the web server.

   /* Write HTML to _WEBOUT */
   filename _webout "example5.html";
   data _null_;
     file _webout;
     put '<html>';
     put '<head>';
     put '<title> Example 5: Streaming metacodes in a batch program </title>';
     put '</head>';
     put '<body>';
     put '<applet archive="http://web_server_name/sasweb/graph/metafile.zip"';
     put '   code="MetaViewApplet.class"';
     put '   width="640" height="480" align="TOP">';
     put '   <param name="BackgroundColor" value="0xffffff">';
     put '   <param name="Metacodes" value="' ; * notice unmatched quote;
   run;

   /* Append metacodes to _WEBOUT */
   goptions dev=javameta;
   proc gtestit;
   quit;

   /* Reopen _WEBOUT to finish the HTML. Make sure to append. */
   data _null_;
     file _webout MOD;
     put '">'; * notice unmatched quote;
     put '</applet>';
     put '</body>';
     put '</html>';
   run;

   /* Deassign fileref */
   filename _webout;

Example 6: Build metacode file in a batch program

You can write a SAS program to create the HTML file and related metacode files.

This example is a extension of Example 4. It allows the user to perform a drill-down to another graph by either clicking on a graphical area or by using a pop-up menu to select the drill-down target.

 
   /* Create a macro variable to simplify substitution */
   %let htmlpath=http://web_server_name/sasweb/graph;

   /* Create a new HTML file*/
   filename outfile "example6.html";

   data _null_;
     length archive parent $100;

     archive=quote("&htmlpath/metafile.zip");
     parent= quote("&htmlpath/javameta/allyears.txt");

     file outfile;
     put '<html>';
     put '<head>';
     put '<title> Example 6: Creating a batch program to build an application </title>';
     put '</head>';
     put '<body>';
     put '<applet archive=' archive;
     put '   code="MetaViewApplet.class"';
     put '   width="640" height="480" align="TOP">';
     put '   <param name="ZoomControlEnabled" value="false">';
     put '   <param name="BackgroundColor" value="0xffffff">';
     put '   <param name="Metacodes" value=' parent '>';

     put '</applet>';
     put '</body>';
     put '</html>';
   run;

   /* Deassign fileref */
   filename outfile;

   /* Summarize the data by YEAR, QUARTER and YEAR*QUARTER */
   proc summary data=sashelp.prdsale;
     class year quarter;
     var actual;
     output out=prdsummary sum=actual;
   run;

   /* Post-process the summarized data to create the HTML variable
      holding the text for the drill-down. */
   data yearsonly;
      set prdsummary(where=(_type_ eq 2));
      length htmlvar $600 menustring $100;
      /* MENU= defines pop-up menu text and actions */
      menustring='menu=['||
                   quote('1993 by Quarter')||'=<mref='||quote("&htmlpath\y1993.txt")||'> '||
                   quote('1994 by Quarter')||'=<mref='||quote("&htmlpath\y1994.txt")||'>]';
      /* MREF= defines the file of metacodes for drill-down actions */
      htmlvar='mref='||quote("&htmlpath\y"||put(year,4.)||'.txt')||' '||menustring;
   run;

   /* Use JAVAMETA device driver to create graphics metadata */
   goptions reset=all dev=javameta
            colors=(blue yellow red cyan) ctext=black
            ftext="Helvetica" ftitle="Helvetica"
            htext=24 pt htitle=32 pt ;

   /* Assign _WEBOUT. Remove any earlier version. */
   filename _webout "allyears.txt";
   %let sysrc=%sysfunc(fdelete(_webout));

   /* The IMAGEMAP= and HTML= options add the MREF= and MENU= values
      to the metagraphics data */
   title1 '1993-1994 Sales';
   proc gchart data=yearsonly imagemap=temp ;
   pie3d year / sumvar=actual  discrete nolegend value=arrow slice=arrow
                html=htmlvar;
   run;
   quit;

   /* Assign _WEBOUT to a drill-down file. Remove any earlier version */
   filename _webout "y1993.txt";
   %let sysrc=%sysfunc(fdelete(_webout));

   title1 '1993 Quarterly Sales';
   goptions colors=(red cyan tan ltgray);

   proc gchart data=prdsummary (where=(year eq 1993 and _type_=3));
      pie3d quarter / sumvar=actual discrete nolegend value=arrow slice=arrow;
   run;
   quit;

   /* Assign _WEBOUT to a drill-down file. Remove any earlier version */
   filename _webout "y1994.txt";
   %let sysrc=%sysfunc(fdelete(_webout));

   goptions colors=(red cyan tan ltgray);
   title1 '1994 Quarterly Sales';

   proc gchart data=prdsummary (where=(year eq 1994 and _type_ eq 3));
      pie3d quarter / sumvar=actual discrete nolegend value=arrow slice=arrow;
   run;
   quit;

  /* Deassign fileref */
   filename _webout;

Notes:

1) The files

 example6.html, allyears.txt, y1993.txt, y1994.txt 

must be transferred to the web server.

2) The MENU= option creates application-defined menu items. In this case, the menu contains the items 1993 by Quarter and 1994 by Quarter. When either item is selected, the associated metacodes file (MREF=) is loaded. 

Example 7: Basic coding to display SAS/GRAPH output using ODS

Beginning in SAS/GRAPH Software, Release 8.1, you can use the JAVAMETA device driver with ODS. The advantage of using ODS is that the metacode output is automatically directed to an HTML file that is generated by ODS. Without using ODS, you have to create the HTML file that is required to display the SAS/GRAPH metacodes.

If you are running SAS/GRAPH Version 8, you cannot run examples 7 - 10. See examples 1 - 6 instead.

The GTESTIT procedure outputs three "sets" of metacodes by default, one for each output GRSEG. ODS generates a separate <APPLET> tag for each output GRSEG, which displays all of your graphs on a single HTML page. In the following example, the PICTURE= option on the GTESTIT procedure limits GTESTIT output to one graph.

    /* Assign a fileref for the ODS HTML output. This is the
       only line you have to change to run this example.     */
    filename odsout 'path_to_web_server_space';

    /* Use JAVAMETA device driver with ODS to create graphics metadata */
    /* The metadata is streamed into the output HTML file              */
    ods listing close;
    ods html file='example7.html' path=odsout;
    goptions dev=javameta;
    proc gtestit picture=1;
    quit;
    ods html close;
    ods listing;

Notes:

1) The FILENAME statement defines the path to a web server space. The fileref ODSOUT is an arbitrary name.

2) The PATH= option on the ODS HTML statement references the ODSOUT fileref so that the HTML output is directed to the defined location. The FILE= option assigns the name example7.html to the output HTML file.

3) The DEV= option on the GOPTIONS statement specifies the JAVAMETA device driver so that the graphics output is generated as metacodes.

4) The metacodes for the graph are written inline in the HTML file. All you need to do to see the output is open file example7.html in a browser.

Note.In the output HTML file, the <APPLET> tag references the MetaViewApplet's archive file in the location where it was installed during the SAS/GRAPH installation on the machine that generates the graph. You can see that location in the HTML file on the <APPLET> tag's ARCHIVE attribute. Alternatively, the path is indicated by the SAS System option APPLETLOC, whose value you can see by running PROC OPTIONS or viewing the SAS configuration file. If you publish the applet to the Web, other users need access to that location, or you can specify an alternative location for the <APPLET> tag to look for the archive file. For complete information on the applet archive files, see Archive Locations: SAS/GRAPH Applets for Java.

The display of http://path_to_web_server_space/example7.html:

The MetaViewApplet displays SAS metagraphics data as interactive graphics in your Web browser window. The control at the bottom of the applet is part of the applet and enables you to scale the image.

Example 8: Creating and displaying data tips using ODS

This example shows how to create data tips, which are text boxes that appear in an application when a user passes the mouse pointer over some area. The MetaViewApplet has no default display of data tips, but can display application-defined data tips. To use this feature, you must do some additional processing of the data before creating the graphs.

All of the data processing performed in this example is identical to the processing done in Example 3, which also shows how to create and display data tips. The only difference between the two examples is that Example 3 does not use ODS to generate the output HTML file, while this example uses ODS.

/* Define the path to the web server space. This is the
   only line you have to change to run this example.    */
filename odsout 'path_to_web_server_space';

/* Summarize the data - one observation per PRODUCT*YEAR combination */
   proc summary data=sashelp.prdsale nway;
      class product year;
      var actual;
      output out=prdsummary sum=actual;
   run;

   /* Post-process the summarized data to add an HTML variable
      holding the text for the data tips - one unique tip per subgroup.
      TIP= is a keyword. */
   data prdsummary;
      set prdsummary;
      length htmlvar $100;
      htmlvar='tip=['||
              quote('Product  '||trim(product))
              ||' '||
              quote('Year       '||put(year,4.))
              ||' '||
              quote('Actual     '||trim(left(put(actual,dollar10.2))))
              ||']';
   run;

   /* Use JAVAMETA device driver to create graphics metadata */
   goptions reset=all border dev=javameta
            colors=(blue yellow red cyan) ctext=black
            ftext="Helvetica" ftitle="Helvetica"
            htext=24 pt htitle=32 pt;

   /* Use ODS to direct output to the HTML destination */
   ods listing close;
   ods html file='example8.html' path=odsout
    parameters=("DataTipStyle"="STICK");

   /* The HTML= option adds the data tips to the
      metagraphics data. */
   title1 'Actual Sales by Product';
   proc gchart data=prdsummary;
      hbar3d product / sumvar=actual subgroup=year sum
                       shape=hexagon caxis=black cframe=ltgray
                       html=htmlvar;
   run;
   quit;

   /* Close the HTML destination and open the LISTING destination */
   ods html close;
   ods listing;

Notes:

1) The FILENAME statement defines the path to a web server space. The fileref ODSOUT is an arbitrary name.

2) The PATH= option on the ODS HTML statement references the ODSOUT fileref so that the HTML output is directed to the defined location. The FILE= option assigns the name example8.html to the output HTML file. The PARAMETERS= option specifies that a "stick" should be added to the box that displays the data tips.

3) See Formatting the HTML= variable for how to build strings for data tips, pop-up menus, and drill-down functionality.

4) The GCHART procedure does not use the IMAGEMAP= option that was used in Example 3. That is because ODS maps the data tips to the areas in the graph. IMAGEMAP= is only required when you do not use ODS. However, the HTML= option is still required to indicate which variable stores the data-tip information.

The display of http://path_to_web_server_space/example8.html

The data tip text changes for each subgroup value of each bar, corresponding to the values created for the HTML variable. To remove the Zoom control in the applet, specify PARAMETERS=("ZoomControlEnabled"="false"). See PARAM Attributes for a list of available parameters.

Example 9: Creating and displaying menus using ODS

This example shows how to create pop-up menus that link to target HTML files. The MetaViewApplet has a default pop-up menu, which provides access to Help for the applet. To add additional menu items to that menu, you must create a variable that uses the MENU= keyword to define the menu items and also the paths to their target output.

This example uses a variable named menustring to define the text for the menus, using the MENU= keyword. It defines two menu strings, one for each year that is included in the "parent" graph, which is the graph that will display the menu. The example then uses a variable named htmlvar to identify the HTML files that will be used for the target output, using the HREF= keyword. Using HREF= in combination with MENU= enables you to put both menu strings on each of the graphic elements created in the graph; in this case, two pie slices. The example uses ODS to create all of the required HTML files.

/* Define the path to the web server space. This is the
   only line you have to change to run this example.    */
filename odsout 'path_to_web_server_space';

   /* Summarize the data by YEAR, QUARTER and YEAR*QUARTER */
   proc summary data=sashelp.prdsale;
     class year quarter;
     var actual;
     output out=prdsummary sum=actual;
   run;

   /* Post-process the summarized data to create an HTML variable *
    * to hold the text for the target output. MENU= and HREF= are  *
    * keywords. The menustring variable holds text for the menu,  *
    * and the htmlvar variable is used in combination with it.    */
   data yearsonly;
   set prdsummary(where=(_type_ eq 2));
   length menustring $150 htmlvar $165;
   menustring='menu=['||
      quote('1993 by Quarter')||'=<href='||quote('y1993.html')||'> '||
      quote('1994 by Quarter')||'=<href='||quote('y1994.html')||'>]';
   htmlvar='href='||
      quote('y'||put(year,4.)||'.html')||' '||menustring;
   run;

   /* Use JAVAMETA device driver to create graphics metadata */
   goptions reset=all dev=javameta
            colors=(blue yellow red cyan) ctext=black
            ftext="Helvetica" ftitle="Helvetica"
            htext=24 pt htitle=32 pt ;

   /* Use ODS to direct output to the HTML destination */
   ods listing close;
   ods html file='example9.html' path=odsout ;

   /* The HTML= option adds the HREF values to the
      metagraphics data */
   title1 '1993-1994 Sales';
   proc gchart data=yearsonly ;
   pie3d year / sumvar=actual discrete nolegend
                value=arrow slice=arrow
                html=htmlvar;
   run;
   quit;

   /* Create the target graphs */
   ods html body= "y1993.html";
   goptions colors=(red cyan tan ltgray);
   title1 '1993 Quarterly Sales';
   proc gchart data=prdsummary (where=(year eq 1993 and _type_=3));
      pie3d quarter / sumvar=actual discrete nolegend
                      value=arrow slice=arrow;
   run;
   quit;

   ods html file= "y1994.html";
   goptions colors=(red cyan tan ltgray);
   title1 '1994 Quarterly Sales';
   proc gchart data=prdsummary (where=(year eq 1994 and _type_ eq 3));
      pie3d quarter / sumvar=actual discrete nolegend
                      value=arrow slice=arrow;
   run;
   quit;

   /* Close the HTML destination and open the LISTING destination */
   ods html close;
   ods listing;

Notes:

1) See Formatting the HTML= variable for how to build strings for data tips, pop-up menus, and drill-down functionality.

2) The first ODS HTML statement directs the HTML output to file example9.html. Subsequent ODS HTML statements assign the same file names that were stored on the HTMLVAR variable that is used to define HREF targets.

3) Although the PATH= options is not specified on the second and third ODS HTML statements, it is still in effect. So, all of the output is written to the same location, which is required for the example to work because the HREF values assign only file names for the target output. Thus, the target output must be in the same location as the HTML file that references the graph that implements the menus.

The display of http://path_to_web_server_space/example9.html

The user can use the pop-up menu available from the "parent" pie chart to see another graph showing the breakdown of sales by quarter.

Example 10: Creating a drill-down graph using ODS

Using ODS, you can create a drill-down graph, which enables the user to click on a graphic element to go to target output that is in an HTML file. To use this capability with the MetaViewApplet, you must create a variable that uses the HREF= keyword to store the paths of the target output. This example uses a variable named htmlvar. The example uses ODS to create all of the required HTML files.

/* Define the path to the web server space. This is the
   only line you have to change to run this example.    */
filename odsout 'path_to_web_server_space *';

/* Summarize the data by YEAR, QUARTER and YEAR*QUARTER */
   proc summary data=sashelp.prdsale;
     class year quarter;
     var actual;
     output out=prdsummary sum=actual;
   run;

    /* Post-process the summarized data to create the HTML variable
      holding the text for the drill-down. HREF= is a keyword. */
      data yearsonly;
      set prdsummary(where=(_type_ eq 2));
      length htmlvar $200;
      htmlvar='href='||quote('y'||put(year,4.)||'.html');
   run;

   /* Use JAVAMETA device driver to create graphics metadata */
   goptions reset=all dev=javameta
            colors=(blue yellow red cyan) ctext=black
            ftext="Helvetica" ftitle="Helvetica"
            htext=24 pt htitle=32 pt ;

   /* Use ODS to direct output to the HTML destination */
   ods listing close;
   ods html file='example10.html' path=odsout;

   /* The HTML= option adds the HREF values to the
      metagraphics data */
   title1 '1993-1994 Sales';
   proc gchart data=yearsonly ;
   pie3d year / sumvar=actual discrete nolegend
                value=arrow slice=arrow
                html=htmlvar;
   run;
   quit;

   /* Create the drill-down targets */
   ods html body= "y1993.html";
   goptions colors=(red cyan tan ltgray);
   title1 '1993 Quarterly Sales';
   proc gchart data=prdsummary (where=(year eq 1993 and _type_=3));
      pie3d quarter / sumvar=actual discrete nolegend
                      value=arrow slice=arrow;
   run;
   quit;

   ods html file= "y1994.html";
   goptions colors=(red cyan tan ltgray);
   title1 '1994 Quarterly Sales';
   proc gchart data=prdsummary (where=(year eq 1994 and _type_ eq 3));
      pie3d quarter / sumvar=actual discrete nolegend
                      value=arrow slice=arrow;
   run;
   quit;

   /* Close the HTML destination and open the LISTING destination */
   ods html close;
   ods listing;

Notes:

1) See Formatting the HTML= variable for information on how to build strings for data tips, pop-up menus, and drill-down functionality.

2) The first ODS HTML statement directs the HTML output to file example10.html. Subsequent ODS HTML statements assign the same file names that were stored on the variable htmlvar, which is used to define HREF= targets for the target output.

3) Although the PATH= options is not specified on the second and third ODS HTML statements, it is still in effect. So all of the output is written to the same location, which is required for the example to work because the HREF= values assign only file names for the target output. Thus, the target output must be in the same location as the HTML file that references the drill-down graph.

The display of http://web_server_name/sasweb/graph/javameta/example10.html:

The user can select either slice to see another graph showing the breakdown of sales by quarter.

Formatting the HTML= variable for the MetaViewApplet

The HTML= variable option defines an association of graphical areas with "actions" such as drill-down, data tips, and pop-up menus. The MetaViewApplet recognizes the keywords that are listed below when specified for the value of variable.

The HREF=, MREF=, and MTAG= tags are used to provide "drill-down" functionality for the applet, that is, they indicate another HTML document or set of graphs to display when a user clicks on a graphical area. Only one of these three keywords may appear in value of the HTML= variable. It is not necessary to associate a drill-down action for each graphical area. The associations do not have to be unique.

The MENU= and TIP= tags can be used together and can also be used in combination with one of the drill-down tags HREF=, MREF=, or MTAG=. It is not necessary to associate a menu item or data tip for each graphical area.

PARAM Attributes for the MetaViewApplet

The PARAM attribute METACODES is required. All other PARAM attributes are optional.

Note: SAS Institute provides a formatting tool called the MetaView HTML Generator. This tool is a SAS macro (meta2htm) that is installed as part of SAS/GRAPH software. As an alternative to ODS, the macro can build the HTML file necessary to drive the MetaViewApplet. You must still write the SAS/GRAPH program that generates the metacodes.