Product Reviews

Using charts makes complex data easier to comprehend. Unfortunately the decision to add charts to a Web site or an application doesn't necessarily make life easier for the designers and programmers responsible for displaying them. Depending on the complexity of the data, developers may encounter a seemingly endless series of questions. What type of chart is needed? Should the data be displayed horizontally or vertically? 2D or 3D? What increments should be used along the axis lines? What happens if the data changes?

EspressChart from Quadbase Systems, Inc., is a set of tools to help developers design and implement a variety of chart types. The primary tools that make up EspressChart include Chart Server, Chart Designer, Chart Viewer, and Chart API.

Chart Server provides user authentication as well as local and remote file access. Although Chart Server generally runs on a Web server, it's possible to run it on a stand-alone machine.

Chart Designer is a 100% pure Java, interactive, front-end application that guides developers through the process of creating charts. Designers choose from a list of common chart types, then add customization - including rotating the chart to view it from different angles. Once a chart has been created, it can be exported in a variety of formats. In addition to common formats, such as .gif and .bmp, two formats specific to EspressChart are available. Charts exported as .cht (Chart Designer format) files are accessible to the Chart Viewer applet, as are charts exported as .tpl (the template format for Chart Designer). In addition, .tpl files save chart attributes and the data source, but not the actual data. Whenever a tpl file is loaded, data for the chart is automatically updated.

Chart Viewer is an applet that allows users to view and manipulate charts remotely.

Finally, Chart API is a set of 100% pure Java library functions that can work in conjunction with Chart Server or in a stand-alone mode to create and manipulate charts from within applets and applications. Chart API takes advantage of high-performance algorithms for displaying 3D objects. In fact, it can reproduce all the functionality of Chart Designer.

Creating a Chart
Suppose I want to produce a chart tracking the salary of Alex Rodriguez, who recently signed a 10-year, $252 million contract to play shortstop for the Texas Rangers baseball team.

Because Chart Designer requires Chart Server to be running, the first step is to launch Chart Server. I can accomplish this on my Windows 95 machine by simply executing server.bat. Several command line options are available, including one to turn the Chart Server monitor on or off.

The Chart Server monitor displays information about the current status of the server, such as the number of users currently logged in (see Figure 1). In addition, it allows the administrator to change various settings and fine tune the performance of the server. For example, new to version 3 of EspressChart is a data buffering capability in which the administrator can control whether data requested from a database is stored in a buffer for faster access later or read from the data source each time.

Once Chart Server is up and running, Chart Designer can be launched as an applet by typing the proper URL into a browser or as an application by executing designer.bat. After the user has successfully logged on, five steps are required to create a new chart.

1. Specify a data source (database or data file).
2. Select a chart type.
3. Select suitable chart options.
4. Modify the chart design interactively.
5. Export the chart in the desired format.

If the data for a chart resides in a database, the Chart Wizard prompts you for the URL of the database, the database driver, user name and password, and a valid SQL statement to retrieve the data. In the example below, the data exists in a single data file called "Alex.txt", and I simply provide the name of the file when prompted by the Chart Wizard.

String, boolean, decimal, decimal
Year, option, salary, deferred
"2001", false, 21, 5
"2002", false, 21, 4
"2003", false, 21, 3
"2004", false, 21, 3
"2005", false, 25, 4
"2006", false, 25, 4
"2007", false, 27, 4
"2008", true, 27, 3
"2009", true, 27, 3
"2010", true, 27, 3

In data files, the first row specifies the data types. The EspressChart documentation lists 20 data-type keywords ranging from "boolean" and "int" to "date" and "timestamp". The second row contains the field names, and the remaining rows contain the records.

Once the data is ready it's time to decide precisely how it should be displayed. The Chart Wizard offers a choice of 17 2D and 13 3D chart types (see Figure 2).

If the data is incomplete or incompatible with the chosen chart type, a dialog box appears with an explanation of the problem. The available chart types include:

• Column
• XY(Z) scatter
• Stack column
• Pie
• Stack area
• High low close open (HLCO)
• Surface chart (3D only)
• Overlay chart (2D only)
• Radar chart (2D only)

With the data source identified and the chart type selected, the next step is to precisely map the data from the data source to the chart. For example, the data file describing Alex Rodriguez's contract includes the salary total for each year. Also included are whether the season is an option year and the amount of deferred money to be paid at a later date. This is valuable information, but we don't want to necessarily include it in this particular chart. Fortunately, through the Select Data Mapping dialog box, we can match a specific axis in our chart directly to a column of data in a data file or database.

Final Customization
At this point, designers concerned about the appearance of their charts can take advantage of the flexibility of Chart Designer to modify the look of the chart, as well as add some functionality (see Figure 3).

A background image can be chosen for the chart and a title added. In fact, text can be included anywhere on the chart. Certain variables can also be included in the text for run time substitution. For example, these variables can represent the time, date, or name of a column of data mapped to a particular axis.

Customization isn't limited to adding items to the chart. Virtually any object can be removed. Titles, axis labels, even the axes themselves are not immune.

Further customization is possible for the items that remain. Color and font can be changed. Objects can be moved. The limits of the axes can be changed. Even the thickness of the axis lines can be modified.

Finally, the entire chart can be resized and, in the case of 3D charts, rotated using the navigation panel at the bottom of the screen.

Not all changes made within Chart Designer are cosmetic. Significant functionality can also be added. Hyperlinks can be set up to allow the user to click on a data point and immediately branch to another chart or HTML page. For complex charts, the Drill-Down Wizard helps designers manage links between large numbers of charts by creating drill-down charts at runtime. Charts that contain frequently changing data can be configured to regularly check the database and display any changes.

When the designer decides the chart is complete, several nice features are available. When saving a chart, checkboxes exist for creating HTML and XML files. The HTML file contains code to display the saved chart, and the XML file contains the properties of the chart based on the EspressChartAttributes.dtd file. It's also possible to export the data of the chart to an XML file based on the EspressChartData.dtd file. This is particularly useful for charts based on data from multiple sources, since it allows the data to be stored in a single location.

Chart API
It's no exaggeration that Chart API can produce a chart with a single line of code. In this case, however, I needed two lines to display the salary chart as part of an applet. The call to the class method "setChartServerUsed" must be made prior to creating the chart object if, as in this case, the server isn't being used.

import quadbase.ChartAPI.*;
import java.awt.*;
import java.applet.*;
public class Alex extends Applet {
public void init() {

QbChart.setChartServerUsed( false );

setLayout( new BorderLayout() );
add( "Center",new QbChart(this,"Salary.cht") );
}

Because the salary chart is in 3D, the navigation panel is included in the applet, allowing users to rotate the chart to view it from various angles within the applet without the need for me to write any additional code.

Since Chart API can re-create all the functionality of Chart Designer, I can use it to further modify the chart by changing the title, for example. I can also use it to export the chart as a static image. In this way developers can use JavaServer Pages or servlets to generate charts on the server side before displaying a Web page on the static image and the corresponding map file (if any) dynamically.

Summary
The Chart Designer, despite its power and flexibility, is remarkably intuitive. When I decided I didn't like the background image, I double-clicked on it and was immediately presented with a list of potential replacements. Moving objects, such as the legend, simply involves clicking and dragging.

Still, documentation is important, and the EspressChart documentation is outstanding. The chapter on Chart API has generous portions of sample code, and the chapter on Chart Designer contains detailed descriptions of all of the standard chart types, including guidance on when to use a particular type of chart.

More information, plus the opportunity to download an evaluation copy of EspressChart, is available at www.quadbase.com.

Quadbase Systems, Inc.
2855 Kifer Road
Suite 203
Santa Clara, CA 95051
Web: www.quadbase.com
Phone: 408 982-0835
Fax: 408 982-0838

Test Environment:
OS: Windows 95
Processor: 233MHz Pentium II
Memory: 32MB