NetCharts® Pro Servlet Programming

Java servlets can only return one type of data. Generally servlets return an HTML page for each request received. So when generating chart images within Java servlets using NetCharts Pro, the servlet is unable to return the chart image during the same request. This is of course because of the single-return- type design of servlets and the fact that the MIME types of the image (img/png, img/jpg, etc.) are different from HTML (text/html). This situation requires web application developers to either create a single servlet to generate and return all the chart images or use a Model-II architecture in which the image is placed in memory by the servlet and later accessed by another page.

Single Image Generation Servlet

This approach separates the serving of HTML pages and chart images by the server, and the design revolves around a central servlet that is responsible for the generation of every chart image for a web application.

In this architecture, a single servlet would be responsible for the generation and serving of all the chart images for the entire web application. To generate the charts, the servlet could have access to a repository of chart templates (file based, database, etc.). And the servlet could possibly accept parameters, via HTTP query strings, to modify and customize the chart templates. Each HTML page created by servlets or JSP/HTML pages in the HTML layer would include an HTML image element for each chart image to display. The src attribute for each img element would point to the servlet responsible for serving the chart images.

This architecture works well when a complete separation can be made between the charts images and the HTML layer. Some additional benefits include the encapsulation of the code to interact with NetCharts Pro within a single source, the ability to easily modify the presentation and content of a page without damaging a chart image and the separation of chart template logic from the HTML layer. But it does have some drawbacks. The main drawback involves the complexity involved in customizing charts. Sending variables from the HTML layer to the image generation servlet can become involved. And sometimes complex manipulations cannot be performed at all.

Model-II Architecture (Two-Pass)

The other approach is the most commonly used design to integrate chart images into a web application. The Model-II architecture is sometimes referred to as the “Two-Pass” approach. In this architecture, the servlet that generates the chart image adds the image, either as the binary image data or an instance of a netcharts.pro.util.ServerGeneratedImage, to the HTTP Session. Then the servlet includes an HTML image element for the chart image. The src attribute for the img element would point to a servlet responsible for serving the chart image. This servlet would then pull the image data or ServerGeneratedImage from the HTTP Session and return the image to the client. This servlet does not need to be a special servlet or a shared servlet. A common approach is to use the same servlet, the one that created the chart to begin with, to also serve the chart to the client. This is accomplished by using the URL of the original servlet in the src attribute of the img element. While this approach sounds like more coding than other approaches, it is in practice easier to implement. And with the addition of the netcharts.pro.util.NFServletUtil class in NetCharts Pro, this approach requires very little additional coding to implement.

The NFServletUtil class contains methods to assist with adding charts, both standard and interactive, to web pages. The primary methods of the NFServletUtil class are getDrillDownPage, getRollOverJavaScript, isSecondPass and writeImage.

• The getDrillDownPage methods will return a java.lang.String containing the HTML img element, and any HTML map and area elements if needed, to add the chart to the page. To add a chart image to a page, just call one of the getDrillDownPage method signatures and add the returned String to the page.
  
• The getRollOverJavaScript method will return a java.lang.String containing the JavaScript code used for client-side interactivity. This interactivity is also referred to as “Active Labels”. Adding the returned String to the page will ensure that all interactive charts included within the page have access to the code needed for client-side interactivity.
  
• The isSecondPass method can be used to determine whether a chart image has been added to the HTTP session and is should be returned to the client. This method is used to determine which pass of the “Two-Pass” approach the servlet is processing.
  
• The writeImage method can be used to return the chart image to the client if the servlet is processing the second pass of the “Two-Pass.”

See the Simple Chart Image Generation Servlet example (also in the NetCharts Pro distribution) is a basic example of this approach. Within the doGet method of the SimpleServlet class you will see an example of how to use the “Two-Pass” architecture to create an HTML page containing a chart in the first pass and then return the chart image during the second pass. Each of the four methods described above are used to implement this functionality.

The first method used within the processing of the doGet method is isSecondPass. It is used to determine which pass the servlet is processing to determine the next course of action:

// If the browser is asking for the image data after loading
// the HMTL we sent it, then send the image data
if (NFServletUtil.isSecondPass(request)) {

If the isSecondPass method returns true, then the servlet will perform the logic to process the second pass processing. The base processing that needs to occur is the return of the chart image to the client. This can easily be accomplished using the writeImage method:

NFServletUtil.writeImage(request, response);
return;

Else, if isSecondPass returns false, then the servlet should perform the normal processing to create the HTML page containing the chart image.

}else {
NFGraph chart = null;
try {
ServletOutputStream os = response.getOutputStream();
os.println("<html>");
os.println("<body>");
.. // Output more HTML to the client.
// create a chart object from the template
chart = NFGraph.getGraphFromTemplate(getDefaultChart());
// generate an image and image map.
String page = NFServletUtil.getDrillDownPage(chart, request);
// output the generated chart.
os.println(page);
.. // Output more HTML to the client.
os.println("</body>");
os.println("</html>");
// release graph for garbage collection.
chart.stop();
chart = null;
} catch (Exception ex) {
}
}