<%@page import="ChartDirector.*" %>
<%
//The data for the line chart

double[] data0 = {45,45,45,45,45,45,45,45,45,45};
double[] data1 = {46,48,43,47,50,40,43,48,52,47};

String[] labels = {"330009", "390010", "390011", "390012", "390013", "330014",
    "330015", "330016", "330017", "330018"};

//Create a XYChart object of size 500 x 300 pixels
XYChart c = new XYChart(500, 300);

//Use a pale yellow background (0xffff80) with a black (0x0) edge and a 1 pixel
//3D border
//c.setBackground(0xffff80, 0x0, 1);
c.setBackground(0xFFFFFF, 0x0, 1);

//Set plotarea at (55, 45) with size of 420 x 200 pixels. Use white (0xffffff)
//background. Enable both horizontal and vertical grid by setting their colors
//to light grey (0xc0c0c0)
c.setPlotArea(55, 45, 420, 200, 0xffffff).setGridColor(0xc0c0c0, 0xc0c0c0);

//Add a legend box at (55, 45) (top of plot area) using 8 pts Arial Bold font
//with horizontal layout Set border and background colors of the legend box to
//Transparent
LegendBox legendBox = c.addLegend(55, 45, false, "arialbd.ttf", 8);
legendBox.setBackground(Chart.Transparent);

//Reserve 10% margin at the top of the plot area during auto-scaling to leave
//space for the legends.
c.yAxis().setAutoScale(0.1);

//Add a title to the chart using 11 pts Arial Bold Italic font. The text is
//white 0xffffff on a dark red 0x800000 background.
ChartDirector.TextBox title = c.addTitle("ASSESSMENT SUMMARY",
    "arialbi.ttf", 11, 0x000000);
//title.setBackground(0x800000, -1, 1);
title.setBackground(0xE1E1E1, -1, 1);

//Add a title to the y axis
c.yAxis().setTitle("ASSESSMENT SCORE");

//Set the labels on the x axis. Draw the labels vertical (angle = 90)
c.xAxis().setLabels(labels).setFontAngle(90);

//Add a vertical mark at x = 17 using a semi-transparent purple (0x809933ff)
//color and Arial Bold font. Attached the mark (and therefore its label) to the
//top x axis.
Mark mark = c.xAxis2().addMark(17, 0x809933ff, "EMPLOYEE",
    "arialbd.ttf");

//Set the mark line width to 2 pixels
mark.setLineWidth(2);

//Set the mark label font color to purple (0x9933ff)
mark.setFontColor(0x9933ff);

//Add a copyright message at (475, 240) (bottom right of plot area) using Arial
//Bold font
ChartDirector.TextBox copyRight = c.addText(475, 240,
    "(c) Computer Science Co,ltd.", "arialbd.ttf");
copyRight.setAlignment(Chart.BottomRight);

//Add a line layer to the chart
Layer layer = c.addLineLayer();

//Set the default line width to 3 pixels
layer.setLineWidth(3);

//Add the data sets to the line layer
layer.addDataSet(data0, -1, "SCORE");
layer.addDataSet(data1, -1, "INTEREST");

//Create the image and save it in a temporary location
request.getSession().setAttribute("chart1", c.makeChart2(Chart.PNG));

//Create an image map for the chart
/*String chartImageMap = c.getHTMLImageMap("xystub.jsp", "",
    "title='{dataSetName} @ {xLabel} = USD {value|0} millions'");*/

String[] labels1 = {"KHANCHAI", "PANTIP", "SUREERAT", "PATRAWUT", "UDOM", "UTUMPORN","SUPPACHOK", "BUNMA", "JARINYA", "ANUCHA"};
c.xAxis().setLabels(labels1).setFontAngle(90);

String chartImageMap = c.getHTMLImageMap("xystub.jsp", "",
    "title='{xLabel} @ score {value|0}'");

//Create an image map for the legend box
String legendImageMap = legendBox.getHTMLImageMap("javascript:doSomething();",
    " ", "title='This legend key is clickable!'");

//Obtain the image map coordinates for the title, mark, and copyright message.
//These will be used to define the image map inline. (See HTML code below.)
String titleCoor = title.getImageCoor();
String markCoor = mark.getImageCoor();
String copyRightCoor = copyRight.getImageCoor();
%>

<html>
<body>
<table width="90%" align="center">
  <tr>
    <td><div align="center"></div></td>
  </tr>
  <tr>
    <td> <h1 align="center">&nbsp;</h1>
      <h1 align="center"><a href="viewsource.jsp?file=<%=request.getServletPath()%>"></a><img src="chart1.chart?no_cache=<%=Chart.getUniqueId()%>" border="0" usemap="#map1"> 
        <map name="map1">
          <%=chartImageMap%> <%=legendImageMap%> 
          <area <%=titleCoor%>  href='javascript:doSomething();'
    title='The title is clickable!'>
          <area <%=markCoor%> href='javascript:doSomething();'
    title='The "Merge with Star Tech" text is clickable!'>
          <area <%=copyRightCoor%> href='javascript:doSomething();'
    title='The copyright text is clickable!'>
        </map>
        <SCRIPT>
function doSomething() {
    alert("This is suppose to do something meaningful, but for demo " +
          "purposes, we just pop up this message box to prove that " +
          "the object can response to mouse clicks.");
}
</SCRIPT>
      </h1></td>
  </tr>
</table>
</body>
</html>