![]() ![]() ![]() Introduction HanengCharts is Java applets that you use with your website by supplying the parameters (the values and labels) through HTML PARAM tags. This allows any technology that can generate HTML to work dynamically with HanengCharts. This whitepaper will give you some sample scripts and explanations on how you can use HanengCharts and JSP to generate charts based on form information or data stored in a database. ![]() ![]() ![]() Sample scripts: The sample scripts are located in the JSP folder ![]() ![]() ![]() Example 1: JSP and a HTML form This example uses a regular HTML form where the visitor can insert some values. The JSP script retrieves this information when the form is submitted and the data is used to generate a pie chart. Form.html is a regular HTML page that has a regular HTML form. It has 5 pairs of text fields called Text and Value. The Text is the label that will be used for the value in the legend and the Value is the value that will be used in the pie chart. Here is the HTML code for the page: <HTML> <BODY> <FORM METHOD="POST" ACTION="Pie.jsp"> Text 1: <INPUT NAME="Text_1" TYPE="TEXT" SIZE=20><BR> Value 1: <INPUT NAME="Value_1" TYPE="TEXT" SIZE=5><BR> Text 2: <INPUT NAME="Text_2" TYPE="TEXT" SIZE=20><BR> Value 2: <INPUT NAME="Value_2" TYPE="TEXT" SIZE=5><BR> Text 3: <INPUT NAME="Text_3" TYPE="TEXT" SIZE=20><BR> Value 3: <INPUT NAME="Value_3" TYPE="TEXT" SIZE=5><BR> Text 4: <INPUT NAME="Text_4" TYPE="TEXT" SIZE=20><BR> Value 4: <INPUT NAME="Value_4" TYPE="TEXT" SIZE=5><BR> Text 5: <INPUT NAME="Text_5" TYPE="TEXT" SIZE=20><BR> Value 5: <INPUT NAME="Value_5" TYPE="TEXT" SIZE=5><BR> <INPUT TYPE="SUBMIT" VALUE="Display chart"> </FORM> </BODY> </HTML> Pie.jsp is an JSP script that loops through all the form data from Form.html and outputs PARAM tags with the text and value information. This data is used by HanengCharts to create the chart. Here is the JSP code for Pie.jsp: <HTML> <BODY> <APPLET CODE="HanengCharts.class" ARCHIVE="HanengCharts3.jar" WIDTH=460 HEIGHT=260> <PARAM NAME="LicenseKey" VALUE="DEMO-DTKTG2s3R8xNVzNVFxN"> <PARAM NAME="ChartType" VALUE="pie"> <% for (int i=1; i<=5; i++) { if(request.getParameter("Text_"+i).length() > 0) { out.println("<PARAM NAME=\"Text_"+i+"\" VALUE=\""+request.getParameter("Text_"+i)+"\">"); out.println("<PARAM NAME=\"Value_"+i+"\" VALUE=\""+request.getParameter("Value_"+i)+"\">"); } } %> </APPLET> </BODY> </HTML> ![]() ![]() ![]() Example 2: JSP and MS Access In this example we extract the data we use from an MS Access database. This is done with a JDBC-ODBC bridge connecting JDBC to a standard ODBC connection. 1. Locate the Whitepaper files The sample scripts are located in the JSP folder 2. Upload all files to your server It is important that the HanengCharts.jsp and HanengCharts3.jar are in the same directory. The HanengCharts_Database.mdb needs to be setup with an ODBC connection called "charts". 3. Run the HanengCharts.jsp file to see the result Make sure that your JSP server is running and that you run the file through a browser with the URL being: It should now show up like this: 4. The code for HanengCharts.jsp <%@ page language="java" import="java.sql.*" %> <% Connection conn = null; ResultSet rs = null; /* Check we can find the database driver */ try { Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); } catch(java.lang.ClassNotFoundException e) { System.err.print("ClassNotFoundException: "); System.err.println(e.getMessage()); } /* Try to open the database */ /* The ODBC name is charts, no username or password */ try { conn = DriverManager.getConnection("jdbc:odbc:charts", "", ""); } catch (Exception e) { e.printStackTrace(); System.err.print(e.getClass().getName()); System.err.println(e.getMessage()); } /* Select the chart parameters and values */ Statement stmt = conn.createStatement(); rs = stmt.executeQuery("SELECT * FROM chart"); out.println("<HTML>"); out.println("<BODY>"); out.println("<CENTER>"); out.println("<APPLET CODE=\"HanengCharts.class\" ARCHIVE=\"HanengCharts3.jar\" WIDTH=460 HEIGHT=260>"); out.println("<PARAM NAME=\"LicenseKey\" VALUE=\"Cut & Paste Your License Key In Here\">"); out.println("<PARAM NAME=\"ChartType\" VALUE=\"pie\">"); /* Iterate through the recordset and output all the param tags and values */ if (rs != null){ while (rs.next()) { out.println("\t<PARAM NAME=\""+rs.getString("ParameterName")+"\" VALUE=\""+rs.getString("Value")+"\">"); } rs.close(); } out.println("</APPLET>"); out.println("</CENTER>"); out.println("</BODY>">; out.println("</HTML>">; /* Try to close the database */ try { conn.close(); } catch (Exception e) { System.out.println("Connection close failed"); System.out.println(e.toString()); } %> |