Commits

Anonymous committed 8c6e7d6 Merge

Merge 474 from jqplot

  • Participants
  • Parent commits 10d9ba0, 13d94a8
  • Branches myChanges

Comments (0)

Files changed (78)

 style.css
 tests
 examples/jquery-ui*
+examples/bug*
+examples/_*
+
 
 
 # switch to regexp syntax.
 00e561a667f81c87c1ae067f7a8fb0c8b2537bad 0.9.5
 3b6c07e889e413ab8cc9555d7ecd3015e722b6ae 0.9.5.1
 411585f33f868d421e1c6251924a080303c3ed24 0.9.6
+34d07d02e52dd79c7fefee8244b2a35cb416ce20 0.9.7
 
 Basic Usage Instructions:
 
-jqPlot requires jQuery (tested with 1.3.2 or better). jQuery 1.3.2 is included in 
+jqPlot requires jQuery (1.4+ required for certain features). jQuery 1.4.1 is included in 
 the distribution.  To use jqPlot include jQuery, the jqPlot jQuery plugin, the jqPlot css file and 
 optionally the excanvas script for IE support in your web page...
 
 > <!--[if IE]><script language="javascript" type="text/javascript" src="excanvas.js"></script><![endif]-->
-> <script language="javascript" type="text/javascript" src="jquery-1.3.2.min.js"></script>
+> <script language="javascript" type="text/javascript" src="jquery-1.4.1.min.js"></script>
 > <script language="javascript" type="text/javascript" src="jquery.jqplot.min.js"></script>
 > <link rel="stylesheet" type="text/css" href="jquery.jqplot.css" />
 
     <loadfile description="Version to build" property="version" srcfile="version.txt" />
     <loadfile description="Copyright and license" property="copyright" srcfile="copyright.txt" />
     <property description="NaturalDocs" name="ND" value="extras/NaturalDocs/NaturalDocs" />
+    
+    <exec executable="hg" outputproperty="HG_ID">
+      <arg value="id"/>
+      <arg value="-n"/>
+    </exec>
 
     <!-- MAIN -->
        
         
         <copy todir="${BUILD_DIR}/examples">
           <fileset dir="examples">
+            <exclude name="_*" />
+            <exclude name="bug*" />
           </fileset>
         </copy>
         
         <replace file="${BUILD_DIR}/jqPlotOptions.txt" token="}}}" value="(end)" />
         <replace file="${BUILD_DIR}/jqPlotOptions.txt" token="**" value="*" />
         
-        <replaceregexp match="@VERSION" replace="${version}" file="${BUILD_DIR}/jqplot.core.js" />
+        <replaceregexp match="@VERSION" replace="${version}r${HG_ID}" file="${BUILD_DIR}/jqplot.core.js" />
         
         <copy todir="${BUILD_DIR}/plugins">
           <fileset dir="${SRC_DIR}/plugins" includes="*" />
     </target>
     
   <target name="compress" depends="dist" description="Create the zip, gzip, and bzip compressed archives for downloading">
-      <zip destfile="${DIST_DIR}/jquery.jqplot.${version}.zip"
+      <zip destfile="${DIST_DIR}/jquery.jqplot.${version}r${HG_ID}.zip"
        basedir=""
        includes="${DIST_DIR}/excanvas*.js ${DIST_DIR}/jquery*.min.js ${DIST_DIR}/jquery.jqplot.* ${DIST_DIR}/*.txt ${DIST_DIR}/plugins/* ${DIST_DIR}/examples/* ${DIST_DIR}/examples/jquery-ui/css/overcast/* ${DIST_DIR}/examples/jquery-ui/css/overcast/images/* ${DIST_DIR}/examples/jquery-ui/js/*"
       />
-      <tar destfile="${DIST_DIR}/jquery.jqplot.${version}.tar.gz" compression="gzip">
-          <zipfileset src="${DIST_DIR}/jquery.jqplot.${version}.zip"/>
+      <tar destfile="${DIST_DIR}/jquery.jqplot.${version}r${HG_ID}.tar.gz" compression="gzip">
+          <zipfileset src="${DIST_DIR}/jquery.jqplot.${version}r${HG_ID}.zip"/>
       </tar>
-      <tar destfile="${DIST_DIR}/jquery.jqplot.${version}.tar.bz2" compression="bzip2">
-          <zipfileset src="${DIST_DIR}/jquery.jqplot.${version}.zip"/>
+      <tar destfile="${DIST_DIR}/jquery.jqplot.${version}r${HG_ID}.tar.bz2" compression="bzip2">
+          <zipfileset src="${DIST_DIR}/jquery.jqplot.${version}r${HG_ID}.zip"/>
       </tar>
   </target>
 
   <target name="docs" description="Create documentation for distribution.">
     <echo message="Creating documentation" />
       <!-- don't want to process jquery itself -->
-        <move file="${BUILD_DIR}/jquery-1.3.2.js" tofile="${BUILD_DIR}/jquery-1.3.2.js.bak" />
+        <move file="${BUILD_DIR}/jquery-1.4.1.js" tofile="${BUILD_DIR}/jquery-1.4.1.js.bak" />
         <mkdir dir="${DIST_DIR}/docs" />
         <!-- rename files we don't used for docs -->
         <move file="${BUILD_DIR}/jquery.jqplot.js" tofile="${BUILD_DIR}/jquery.jqplot.js.bak"/>
         </exec>
         <!-- put files back -->
         <move file="${BUILD_DIR}/jquery.jqplot.js.bak" tofile="${BUILD_DIR}/jquery.jqplot.js"/>
-        <replaceregexp match="@VERSION" replace="${version}" flags="g">
+        <replaceregexp match="@VERSION" replace="${version}r${HG_ID}" flags="g">
           <fileset dir="${DIST_DIR}/docs/index" includes="*.html" />
           <fileset dir="${DIST_DIR}/docs/files" includes="*.html" />
         </replaceregexp>
           <fileset dir="${SRC_DIR}/images" includes="*.png" />
         </copy>
         <!-- put jquery back the way it was -->
-        <move file="${BUILD_DIR}/jquery-1.3.2.js.bak" tofile="${BUILD_DIR}/jquery-1.3.2.js" />
+        <move file="${BUILD_DIR}/jquery-1.4.1.js.bak" tofile="${BUILD_DIR}/jquery-1.4.1.js" />
         <echo message="Documentation Finished" />
   </target>
 

File examples/.htaccess

+AddType application/x-httpd-php .php .html .htm

File examples/OHLC.html

 <html lang="en">
 <head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <title>Single Negative Point</title>
+  <title>OHLC Charts</title>
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 
   </head>
   <body>
+<?php include "nav.inc"; ?>
 <div id="chart1" style="margin:20px;height:240px; width:640px;"></div>
 <div id="chart2" style="margin:20px;height:240px; width:640px;"></div>
 <div id="chart3" style="margin:20px;height:240px; width:640px;"></div>

File examples/OHLC2.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 
   </head>
   <body>
+<?php include "nav.inc"; ?>
 <div id="chart1" style="margin:20px;height:240px; width:640px;"></div>
 <div id="chart2" style="margin:20px;height:240px; width:640px;"></div>
   </body>

File examples/axisLabelsRotatedText.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 		
 </head>
 <body>
+<?php include "nav.inc"; ?>
 		<div class="jqplot" id="chart1"></div>
 		<div class="jqplot" id="chart2"></div>
 		<div class="jqplot" id="chart3"></div>

File examples/axisLabelsRotatedText2.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 		
 </head>
 <body>
+<?php include "nav.inc"; ?>
 		<div class="jqplot" id="chart1" class="graph"></div>
 		<div class="jqplot" id="chart2" class="graph"></div>
 		<div class="jqplot" id="chart3" class="graph"></div>

File examples/barLinePieStack.html

-<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
-   "http://www.w3.org/TR/html4/loose.dtd">
+<!DOCTYPE html>
 
 <html lang="en">
 <head>
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart1" style="margin-top:20px; margin-left:50px; width:360px; height:300px;"></div>
     <div id="chart2" style="margin-top:20px; margin-left:50px; width:360px; height:300px;"></div>
     <div id="chart3" style="margin-top:20px; margin-left:50px; width:360px; height:300px;"></div>

File examples/barMissingValues.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 line3 = [[2006, 5], [2007, 1], [2008, 3], [2009, 7]];
 line4 = [[2006, 2], [2007, 5], [2008, 4], [2009, 9]];
 
-plot3 = $.jqplot('chart', [line1, line2, line3, line4], {
+plot1 = $.jqplot('chart1', [line1, line2, line3, line4], {
     seriesDefaults:{renderer:$.jqplot.BarRenderer, rendererOptions:{barPadding:10, barMargin:10}},
     legend: {show:true, location: 'nw'},
-    axes:{xaxis:{renderer:$.jqplot.CategoryAxisRenderer}, yaxis:{min:0, max:20, numberTicks:6}}
+    axes:{xaxis:{renderer:$.jqplot.CategoryAxisRenderer, rendererOptions:{sortMergedLabels:true}}, yaxis:{min:0, max:20, numberTicks:6}}
     });
 
 
+s1 = [4, 3, 9, 16, 12, 8];
+s2 = [null, null, null, 3, 7, 6];
+
+ticks = [2006, 2007, 2008, 2009, 2010, 2011];
+
+plot2 = $.jqplot('chart2', [s1, s2], {
+    seriesDefaults:{},
+    legend: {show:true, location: 'nw'},
+    axes:{xaxis:{renderer:$.jqplot.CategoryAxisRenderer, ticks:ticks}, yaxis:{min:0, max:20, numberTicks:6}}
+    });
+
   });
   </script>
   </head>
   <body>
-    <div id="chart" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
+<?php include "nav.inc"; ?>
+    <div id="chart1" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
+    <div id="chart2" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
   </body>
 </html>

File examples/bezierCurve.html

+<!DOCTYPE html>
+
+<html>
+<head>
+  <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
+  
+  <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
+  <!-- BEGIN: load jquery -->
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
+
+  <!-- END: load jquery -->
+  
+  <!-- BEGIN: load jqplot -->
+  <script language="javascript" type="text/javascript" src="../src/jquery.jqplot.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/plugins/jqplot.bezierCurveRenderer.js"></script>
+		
+
+<script type="text/javascript" language="javascript">
+
+$(document).ready(function(){
+    
+    var line1 = [[0, 1], [2, 2, 4, .5, 6, 0]];
+    var line2 = [[0, 5], [2, 6, 5, 1, 6, .5]];
+    var line3 = [[0, 6], [3, 9, 4, 8, 6, 3]];
+    var line4 = [[0, 7], [2, 9, 4, 8, 6, 6]];
+    var line5 = [[0, 8], [3, 9, 4, 8, 6, 8]];
+
+    plot1 = $.jqplot("chart1", [line1,line2, line3, line4, line5], {
+           seriesDefaults: {renderer:$.jqplot.BezierCurveRenderer},
+           legend:{show:true}
+    });
+});
+
+             
+</script>
+</head>
+<body>
+<?php include "nav.inc"; ?>
+<div id="chart1" class='plot' style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
+ 
+</body>
+
+
+</html>

File examples/categoryHorizontalBar.html

 		<!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
 		  
 		<link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
 		
 		<!-- BEGIN: load jquery -->
-		<script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+		<script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 		<!-- END: load jquery -->
 		
 		<!-- BEGIN: load jqplot -->
 
 	</head>
 	<body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:400px; height:240px;"></div>
     <div id="chart2" style="margin-top:20px; margin-left:20px; width:320px; height:270px;"></div>
 

File examples/categoryVsLinearAxes.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart1" style="margin-top:20px; margin-left:20px; width:300px; height:200px;"></div>
     <div id="chart2" style="margin-top:20px; margin-left:20px; width:300px; height:200px;"></div>
   </body>

File examples/chartInTable.html

 <head>
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.min.js"></script><![endif]-->
     <script language="javascript" type="text/javascript" src="../src/excanvas.js"></script>
-    <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+    <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
     <script language="javascript" type="text/javascript" src="../src/jquery.jqplot.js"></script>
     <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
 
 <script language="javascript" type="text/javascript">
 $(document).ready(function(){
 </script>
 </head>
 <body>
+<?php include "nav.inc"; ?>
     <table>
         <tr>
             <td>

File examples/customHighlighterCursorTrendline.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 
   </head>
   <body>
+<?php include "nav.inc"; ?>
 <div id="test" class="plot" style="width:500px;height:300px;"></div>
 <script language="javascript" type="text/javascript"><!--
    s1 = [['23-May-08',1],['24-May-08',4],['25-May-08',2],['26-May-08',

File examples/customPieTests.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart1" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
     <div id="chart2" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
     <div id="chart3" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>

File examples/dataTracking.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.min.js"></script><![endif]-->
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 		
 </head>
 <body>
+<?php include "nav.inc"; ?>
 <div class="jqPlot" id="chart1" style="height:320px; width:600px;"></div>
  
 </body>

File examples/examples.css

+body {
+    margin:20px;
+    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
+}
+
+div.nav {
+    margin-bottom:10px;
+}

File examples/fillToZero.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.min.js"></script><![endif]-->
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 		
 </head>
 <body>
+<?php include "nav.inc"; ?>
 <div class="jqPlot" id="chart1" style="height:320px; width:420px;"></div>
 <div class="jqPlot" id="chart1b" style="height:320px; width:420px;"></div>
 <div class="jqPlot" id="chart2" style="height:320px; width:420px;"></div>

File examples/filledLine.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:360px; height:300px;"></div>
     <div id="chart2" style="margin-top:20px; margin-left:20px; width:360px; height:300px;"></div>
     <div id="chart3" style="margin-top:20px; margin-left:20px; width:360px; height:300px;"></div>

File examples/filledLineCategoryAxis.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
   </body>
 </html>

File examples/gridCustomization.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:360px; height:300px;"></div>
   </body>
 </html>

File examples/hiddenPlot.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   <link type="text/css" href="jquery-ui/css/overcast/jquery-ui-1.7.2.custom.css" rel="Stylesheet" />
   
   <style type="text/css">
   </style>
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <table><tr><td>
       <p>This page demonstrates using plots within containers that are initially hidden.  Examples are shown for jQuery UI tabs and Accordions</p>
   <div id="tabs">

File examples/highlighter.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   <script language="javascript" type="text/javascript" src="../src/jquery.jqplot.js"></script>
   <script language="javascript" type="text/javascript" src="../src/plugins/jqplot.dateAxisRenderer.js"></script>
   <script language="javascript" type="text/javascript" src="../src/plugins/jqplot.highlighter.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/plugins/jqplot.cursor.js"></script>
   <!-- END: load jqplot -->
 
-  </head>
-  <body>
-<div id="test" class="plot" style="width:500px;height:300px;"></div>
-<script language="javascript" type="text/javascript"><!--
+
+<script language="javascript" type="text/javascript">
+
+$(document).ready(function(){
    s1 = [['23-May-08',1],['24-May-08',4],['25-May-08',2],['26-May-08',
 6]];
 
+    s2 = [3,5,7,4,8];
+    s3 = [9,11,15,8,15];
+    s4 = [8,7,12,18,4];
+    s5 = [13,17,21,19,11];
+    l1 = [];
+    l2 = [];
+    l3 = [];
+    
+    for (var i=0; i<100; i++) {
+        l1.push(Math.random()*7);
+        l2.push(Math.random()*13);
+        l3.push(Math.random()*2);
+    }
 
-   plot1 = $.jqplot('test',[s1],{
+
+   plot1 = $.jqplot('chart1',[s1],{
        title: 'Highlighting',
        axes: {
            xaxis: {
            formatString: 'Hello %s dayglow %d'
        },
        cursor: {
-           show: true
+           show: true,
+           zoom: true
        }
    });
---></script>
+   
+   plot2 = $.jqplot('chart2', [s2, s3, s4, s5], { highlighter: { bringSeriesToFront: true, tooltipLocation: 'e', tooltipOffset: 0, formatString: '<div class="jqplot-highlighter"><span>#seriesLabel#</span>%s: <strong>%s</strong></div>' } });
+   plot3 = $.jqplot('chart3', [s2, s3], { highlighter: { bringSeriesToFront: true, tooltipLocation: 'e', tooltipOffset: 0, formatString: '<div class="jqplot-highlighter"><span>#seriesLabel#</span>%s: <strong>%s</strong></div>' } });
+   plot4 = $.jqplot('chart4', [s2, s3, s4], { highlighter: { bringSeriesToFront: true, tooltipLocation: 'e', tooltipOffset: 0, formatString: '<div class="jqplot-highlighter"><span>#seriesLabel#</span>%s: <strong>%s</strong></div>' } });
+   plot5 = $.jqplot('chart5', [l1, l2, l3], { seriesDefaults:{neighborThreshold:0, showMarker:false}, highlighter: { bringSeriesToFront: true, tooltipLocation: 'e', tooltipOffset: 0, formatString: '<div class="jqplot-highlighter"><span>#seriesLabel#</span>%s: <strong>%s</strong></div>' } });
+   
+});
+
+</script>
+  </head>
+  <body>
+<?php include "nav.inc"; ?>
+<div id="chart1" class="plot" style="width:500px;height:300px;"></div>
+<div id="chart2" class="plot" style="width:500px;height:300px;"></div>
+<div id="chart3" class="plot" style="width:500px;height:300px;"></div>
+<div id="chart4" class="plot" style="width:500px;height:300px;"></div>
+<div id="chart5" class="plot" style="width:500px;height:300px;"></div>
+
+
 
   </body>
 </html>

File examples/horizontalLine.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:500px; height:300px;"></div>
   </body>
 </html>

File examples/markerStyles.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.min.js"></script><![endif]-->
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 		
 </head>
 <body>
+<?php include "nav.inc"; ?>
 
 <div class="jqPlot" id="chart1" style="height:380px; width:480px;"></div>
- 
-</div>
 
 </body>
 

File examples/mekkoChart.html

+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+   "http://www.w3.org/TR/html4/loose.dtd">
+
+<html lang="en">
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+  <title>Simple Test</title>
+  <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
+  
+  <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
+  
+  <!-- BEGIN: load jquery -->
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
+  <!-- END: load jquery -->
+  
+  <!-- BEGIN: load jqplot -->
+  <script language="javascript" type="text/javascript" src="../src/jquery.jqplot.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/plugins/jqplot.mekkoRenderer.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/plugins/jqplot.mekkoAxisRenderer.js"></script>
+  <!-- END: load jqplot -->
+  <style type="text/css" media="screen">
+    body {
+        margin: 15px;
+        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
+    }
+    
+    p {
+        margin-top: 20px;
+        margin-bottom: 20px;
+    }
+    
+    .jqplot-target {
+        margin: 60px;
+    }
+    
+    pre {
+        padding: 10px;
+        background-color: #efead9;
+        margin: 10px;
+    }
+    .jqplot-axis {
+      font-size: 0.8em;
+    }
+    
+    .jqplot-mekko-barLabel {
+        font-size: 1em;
+    }
+    
+    #chart2 .jqplot-axis {
+        font-size: 0.7em;
+    }
+  </style>
+  <script type="text/javascript" language="javascript">
+  
+  $(document).ready(function(){
+
+    bar1 = [['shirts', 8],['hats', 14],['shoes', 6],['gloves', 16],['dolls', 12]];
+    bar2 = [15,6,9,13,6];
+    bar3 = [['grumpy',4],['sneezy',2],['happy',7],['sleepy',9],['doc',7]];
+    barLabels = ['Mickey Mouse', 'Donald Duck', 'Goofy'];
+
+    plot1 = $.jqplot('chart1', [bar1, bar2, bar3], {
+        title: 'Revenue Breakdown per Character',
+        seriesDefaults:{renderer:$.jqplot.MekkoRenderer},
+        legend:{show:true},
+        axesDefaults:{
+            renderer:$.jqplot.MekkoAxisRenderer
+        },
+        axes:{
+            xaxis:{ 
+                barLabels:barLabels,
+                tickOptions:{formatString:'$%dM'}
+            }
+        }
+    });
+
+    plot2 = $.jqplot('chart2', [bar1, bar2, bar3], {
+        title: 'Revenue Breakdown per Character',
+        seriesDefaults:{renderer:$.jqplot.MekkoRenderer},
+        legend:{
+            show:true, 
+            rendererOptions:{placement: "inside"}, 
+            location:'e'
+        },
+        axesDefaults:{
+            renderer:$.jqplot.MekkoAxisRenderer, 
+            tickOptions:{}
+        },
+        axes:{
+            xaxis:{
+                barLabels:barLabels,
+                max: 175,
+                tickOptions:{formatString:'$%dM'}
+            }, 
+            x2axis:{
+                show:true, 
+                tickMode:'even', 
+                max: 175,
+                tickOptions:{formatString:'$%dM'}
+            }
+        }
+    });
+
+    var legendLabels = ['hotels', 'rides', 'buses', 'instruments', 'totes'];
+    
+    plot3 = $.jqplot('chart3', [bar1, bar2, bar3], {
+        title: 'Revenue Breakdown per Character',
+        seriesDefaults:{renderer:$.jqplot.MekkoRenderer},
+        legend:{
+            show:true, 
+            rendererOptions:{labels:legendLabels, placement: "outside"}, 
+            location:'e'
+        },
+        axesDefaults:{
+            renderer:$.jqplot.MekkoAxisRenderer, 
+            tickOptions:{showGridline:false}
+        },
+        axes:{
+            xaxis:{
+                tickMode:"bar", 
+                tickOptions:{formatString:'$%dM'}
+            }, 
+            x2axis:{
+                show:true, 
+                tickMode:'even', 
+                tickOptions:{formatString:'$%dM'}
+            }
+        }
+    });
+
+  });
+  </script>
+  </head>
+  <body>
+<?php include "nav.inc"; ?>
+      
+      <p>Mekko charts make a number of customizations to the series, axes and legend.  You can create a Mekko chart by including the renderers:</p>
+<pre>
+&lt;script language=&quot;javascript&quot; type=&quot;text/javascript&quot; src=&quot;../src/plugins/jqplot.mekkoRenderer.js&quot;&gt;&lt;/script&gt;
+&lt;script language=&quot;javascript&quot; type=&quot;text/javascript&quot; src=&quot;../src/plugins/jqplot.mekkoAxisRenderer.js&quot;&gt;&lt;/script&gt;
+</pre>
+  
+  <p>Data is specified per bar in the chart.  You can specify data as an array of y values, or as an array of [label, value] pairs.  Note that labels are used only on the first series.  Labels on subsequent series are ignored:</p>
+<pre>
+bar1 = [['shirts', 8],['hats', 14],['shoes', 6],['gloves', 16],['dolls', 12]];
+bar2 = [15,6,9,13,6];
+bar3 = [['grumpy',4],['sneezy',2],['happy',7],['sleepy',9],['doc',7]];
+</pre>
+
+  <p>If you want to place labels for each bar under the axis, you use the barLabels option on the axes.  The bar labels can be styled with the ".jqplot-mekko-barLabel" css class.</p>
+<pre>
+barLabels = ['Mickey Mouse', 'Donald Duck', 'Goofy'];
+axes:{xaxis:{barLabels:barLabels}}
+</pre>
+
+    <div id="chart1" style="width:500px; height:300px;"></div>
+    
+    <p>You can add a secondary x axes, and the tick spacing of the axes can be separately controlled with the "tickMode" option.  "bar" will produce tics at bar boundaries, "even" will produce evenly spaced ticks.  If you set the axes max greater than the sum of the data range (the maximum x value), the plot will be padded.  Note that you should set the max on both axes to the same value.</p>
+
+<pre>
+axes:{
+    xaxis:{
+        barLabels:barLabels,
+        max: 175
+    }, 
+    x2axis:{
+        show:true, 
+        tickMode:'even', 
+        max: 175
+    }
+}
+</pre>
+
+    <p>Additionally, the legend can be placed "outside" (the default for a mekko chart) or "inside" of the grid area with the "placement" option on the legend renderer.</p>
+
+<pre>
+legend:{
+    show:true, 
+    rendererOptions:{placement: "inside"}, 
+    location:'e'
+},
+</pre>
+    
+    <div id="chart2" style="width:500px; height:300px;"></div>
+    
+    <p>Legend labels can be specified independently of the series with the "labels" option on the legend.  These will override any labels specified with the series.
+    
+<pre>
+legendLabels = ['hotels', 'rides', 'buses', 'instruments', 'totes'];
+
+legend:{
+    show:true, 
+    rendererOptions:{labels:legendLabels, placement: "outside"}, 
+},    
+</pre>
+
+    <div id="chart3" style="width:500px; height:300px;"></div>
+  </body>
+</html>

File examples/minMaxLines.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 
   </head>
   <body>
+<?php include "nav.inc"; ?>
 <div id="chart" style="height:300; width:500;"></div>
   </body>
 </html>

File examples/multiAxesRotatedText.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 </script>
 </head>
 <body>
+<?php include "nav.inc"; ?>
 
 <div class="jqPlot" id="chart2" style="height:320px; width:480px;"></div>
 

File examples/multipleBarColors.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
                    }
                  },
                  xaxis:{
-                   renderer: $.jqplot.CategoryAxisRenderer,
+                   renderer: $.jqplot.CategoryAxisRenderer
                 }
             }
          });
                    }
                  },
                  xaxis:{
-                   renderer: $.jqplot.CategoryAxisRenderer,
+                   renderer: $.jqplot.CategoryAxisRenderer
                 }
             }
          });
 		
 </head>
 <body>
+<?php include "nav.inc"; ?>
     <p>Individual bars can now have different colors.  This is achieved by setting the "varyBarColor" option to true in the series rendererOptions.  The default is to assign each bar a different color from the default "seriesColors" array.  You can customize the seriesColors array to assign whatever colors you like to the bars.</p>
 		<div id="chart1" style="width:500px;height:250px;margin:20px;"></div>
 		<div id="chart2" style="width:500px;height:250px;margin:20px;"></div>

File examples/multipleLines.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart1" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
   </body>
 </html>

File examples/multipleYAxes.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 
     plot1 = $.jqplot('chart', [l1, l3, l4, l5], {
       title:'Default Multiply y axes',
-        series:[{}, {yaxis:'y2axis'}, {yaxis:'y3axis'}, {yaxis:'y4axis'}, {yaxis:'y5axis'}, {yaxis:'y6axis'}]
+        series:[{}, {yaxis:'y2axis'}, {yaxis:'y3axis'}, {yaxis:'y4axis'}, {yaxis:'y5axis'}, {yaxis:'y6axis'}],
+      highlighter:{bringSeriesToFront:true}
     });
 
 
         series:[{}, {yaxis:'y2axis'}, {yaxis:'y3axis'}, {yaxis:'y4axis'}, {yaxis:'y5axis'}, {yaxis:'y6axis'}],
         axesDefaults:{useSeriesColor: true},
         axes:{y2axis:{padMax:2}, y3axis:{padMax:2.5}, y4axis:{padMin:2}, y5axis:{padMin:2.3}},
-        grid:{gridLineWidth:1.0, borderWidth:2.5, shadow:false}
+        grid:{gridLineWidth:1.0, borderWidth:2.5, shadow:false},
+      highlighter:{bringSeriesToFront:true}
     });
     
     plot3 = $.jqplot('chart3', [l1, l3, l4, l5], {
       axesDefaults:{show:false},
-      gridPadding: {top:0, bottom:0, left:0, right:44}
+      gridPadding: {top:0, bottom:0, left:0, right:44},
+      highlighter:{bringSeriesToFront:true}
     });
     
     plot4 = $.jqplot('chart4', [l1, l3, l4, l5], {
       axesDefaults:{show:false},
-      axes:{xaxis:{show:false}, yaxis:{show:false}}
+      axes:{xaxis:{show:false}, yaxis:{show:false}},
+      highlighter:{bringSeriesToFront:true}
     });
 
 
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:700px; height:300px;"></div>
     <div id="chart2" style="margin-top:20px; margin-left:20px; width:700px; height:300px;"></div>
     <div id="chart3" style="margin-top:20px; margin-left:20px; width:700px; height:300px;"></div>

File examples/nav.inc

+<div class="nav">
+  <?php
+    $dh  = opendir('./');
+    while (false !== ($filename = readdir($dh))) {
+        if (preg_match('/.*\.html$/', $filename)) {
+          $files[] = $filename;
+        }
+    }
+    $fcount = count($files);
+    $parts = explode("/", $_SERVER['SCRIPT_NAME']);
+    $curfile = end($parts);
+    $prevfile = '';
+    $nextfile = '';
+    // echo $fcount, $curfile;
+    // print_r($files);
+    
+    for ($i=0; $i<$fcount; $i++) {
+      if ($curfile == $files[$i]) {
+        $prevfile = $files[$i-1];
+        $nextfile = $files[$i+1];
+        if ($i == 0) {
+          $prevfile = $files[$fcount-1];
+          $nextfile = $files[1];
+        }
+        elseif ($i == $fcount-1) {
+          $prevfile = $files[$i-1];
+          $nextfile = $files[0];
+        }
+      }  
+    }
+    
+    echo '<a href="'.$prevfile.'">Previous</a> <a href="./">Examples</a> <a href="'.$nextfile.'">Next</a>';
+    
+  ?>
+</div>

File examples/pieTest.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
     
     $.jqplot.config.enablePlugins = true;
 
-    plot1 = $.jqplot('pie', [[['a',25],['b',14],['c',7]]], {
-    seriesDefaults:{renderer:$.jqplot.PieRenderer, rendererOptions: {diameter: 200}, trendline:{show:true}},
+    plot1 = $.jqplot('pie1', [[['a',25],['b',14],['c',7]]], {
+      seriesDefaults:{renderer:$.jqplot.PieRenderer, trendline:{show:true}},
       legend:{show:true}      
     });
 
-    plot2 = $.jqplot('pie1', [[['a',25],['b',0],['c',0]]], {
+    plot2 = $.jqplot('pie2', [[['a',25],['b',0],['c',0]]], {
+      seriesDefaults:{renderer:$.jqplot.PieRenderer, trendline:{show:true}},
+      legend:{show:true}      
+    });
+
+    plot3 = $.jqplot('pie3', [[['a',5],['b',0],['c',7]]], {
       seriesDefaults:{renderer:$.jqplot.PieRenderer, trendline:{show:true}},
       legend:{show:true}      
     });
     
-    plot3 = $.jqplot('pie2', [[["a",1000],["b",.001],["c",.001]]], {
+    plot4 = $.jqplot('pie4', [[["a",1000],["b",.001],["c",.001]]], {
       seriesDefaults:{renderer:$.jqplot.PieRenderer, trendline:{show:true}},
       legend:{show:true}      
     });
   </script>
   </head>
   <body>
-    This page tests for 2 conditions.  Plotting pies with a slice that begins at 0 and ends at and near 2*pi (360 degrees) and disabling the trendline plugin on pies.
-    <div id="pie" style="margin-top:20px; margin-left:20px; width:200px; height:200px;"></div>
+<?php include "nav.inc"; ?>
+    This page tests for 3 conditions.  Plotting pies with a slice that begins at 0 and ends at and near 2*pi (360 degrees), disabling the trendline plugin on pies, and plotting a pie that has a 0 value in the data set.
     <div id="pie1" style="margin-top:20px; margin-left:20px; width:200px; height:200px;"></div>
     <div id="pie2" style="margin-top:20px; margin-left:20px; width:200px; height:200px;"></div>
+    <div id="pie3" style="margin-top:20px; margin-left:20px; width:200px; height:200px;"></div>
+    <div id="pie4" style="margin-top:20px; margin-left:20px; width:200px; height:200px;"></div>
   </body>
 </html>

File examples/pointLabels.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <p>Click and drag to zoom.  Double click on plot or click "Reset Zoom" button to reset zoom.</p>
 <div id="chart" style="height:300px; width:600px;"></div>
 <div style="padding-top:20px">

File examples/resizablePlot.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   <link type="text/css" href="jquery-ui/css/overcast/jquery-ui-1.7.2.custom.css" rel="Stylesheet" />
   
   <style type="text/css">
   </style>
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     
 <p>Plot targets can be placed inside of resizable containers for dynamic plot sizing.  The examples here use the jQuery UI package for resizing functionality.</p>
 

File examples/rotatedTickLabels.html

 		<!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
 		  
 		<link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
 		
 		<!-- BEGIN: load jquery -->
-		<script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+		<script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 		<!-- END: load jquery -->
 		
 		<!-- BEGIN: load jqplot -->
 
 	</head>
 	<body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:60px; width:500px; height:300px;"></div>
 
 	</body>

File examples/rotatedTickLabelsZoom.html

 		<!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
 		  
 		<link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
 		
 		<!-- BEGIN: load jquery -->
-		<script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+		<script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 		<!-- END: load jquery -->
 		
 		<!-- BEGIN: load jqplot -->
 
 	</head>
 	<body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:60px; width:500px; height:300px;"></div>
 
 	</body>

File examples/seriesCanvasReorder.html

+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+   "http://www.w3.org/TR/html4/loose.dtd">
+
+<html lang="en">
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+  <title>Simple Test</title>
+  <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
+  
+  <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
+  
+  <!-- BEGIN: load jquery -->
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
+  <!-- END: load jquery -->
+  
+  <!-- BEGIN: load jqplot -->
+  <script language="javascript" type="text/javascript" src="../src/jquery.jqplot.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/plugins/jqplot.highlighter.js"></script>
+
+  <!-- END: load jqplot -->
+  <style type="text/css" media="screen">
+    .jqplot-axis {
+      font-size: 0.85em;
+    }
+    .jqplot-title {
+      font-size: 1.1em;
+    }
+    select, input {
+        margin-right: 15px;
+    }
+    #chart1 {
+        margin-bottom: 40px;
+    }
+  </style>
+  <script type="text/javascript" language="javascript">
+  
+  $(document).ready(function(){
+
+    var l1 = [3, 4, 1, 4, 2];
+    var l2 = [2, 5, 1, 4, 2];
+    var l3 = [1, 6, 1, 4, 2];
+
+
+    plot1 = $.jqplot('chart1', [l1, l2, l3], {
+        legend:{show:true},
+        seriesDefaults: {lineWidth:4},
+        series:[{label:'lions'}, {label:'tigers'}, {label:'bears'}],
+        seriesColors:['#cc6666', '#66cc66', '#6666cc'],
+        highlighter: {bringSeriesToFront: true}
+    });
+
+  });
+  </script>
+  </head>
+  <body>
+<?php include "nav.inc"; ?>
+
+    <p>When lines overlap each other it can be difficult to tell what is going on with the series below the top.  4 methods help to deal with this by enabling series to be brought forward and pushed back.  Click the buttons below to bring individual series to the front.  The "Last Order" button will toggle the current series order with the last displayed series order.  The "Original Original" button will reset the series to display in the order when the plot was created.</p>
+    
+    <p>Additionally, the highlighter plugin has been enhanced with a "bringSeriesToFront" option which will bring the series of the highlighted point to the front when a data point is highlighted.  Note, however, when highlighting a point which coincides with multiple series, highlighter will detect this as the top most series and no highlighting effect will be noticed.</p>
+    
+    <p>Roll over data points in the series below and the appropriate line will be brought to the top:</p>
+    
+    <div id="chart1" style="margin-top:20px; margin-left:20px; width:360px; height:300px;"></div>
+    
+    <button onclick="plot1.moveSeriesToFront(0);">Lions</button> 
+    <button onclick="plot1.moveSeriesToFront(1);">Tigers</button> 
+    <button onclick="plot1.moveSeriesToFront(2);">Bears</button> 
+    
+    <button onclick="plot1.restorePreviousSeriesOrder();">Last Order</button> 
+    <button onclick="plot1.restoreOriginalSeriesOrder();">Original Order</button>
+    
+    <p>The 4 methods to achieve this effect are:</p>
+    
+<pre>
+    plot.moveSeriesToFront(series index);
+    plot.restorePreviousSeriesOrder();
+    plot.restoreOriginalSeriesOrder();
+    plot.moveSeriesToBack(series index);
+</pre>
+
+<p>moveSeriesToBack is not demonstrated here, but is available.</p>
+    
+  </body>
+</html>

File examples/seriesUpdate.html

+<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+   "http://www.w3.org/TR/html4/loose.dtd">
+
+<html lang="en">
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+  <title>Simple Test</title>
+  <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
+  
+  <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
+  
+  <!-- BEGIN: load jquery -->
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
+  <!-- END: load jquery -->
+  
+  <!-- BEGIN: load jqplot -->
+  <script language="javascript" type="text/javascript" src="../src/jquery.jqplot.js"></script>
+
+  <!-- END: load jqplot -->
+  <style type="text/css" media="screen">
+    .jqplot-axis {
+      font-size: 0.85em;
+    }
+    .jqplot-title {
+      font-size: 1.1em;
+    }
+    select, input {
+        margin-right: 15px;
+    }
+    #chart1 {
+        margin-bottom: 40px;
+    }
+  </style>
+  <script type="text/javascript" language="javascript">
+    
+    function updatePoint() {
+        var f = document.forms[0];
+        var seriesIndex = f.seriesId.selectedIndex;
+        var series = plot1.series[seriesIndex];
+        var data = series.data[f.pointId.selectedIndex];
+        var xval = parseFloat(f.xvalue.value);
+        var yval = parseFloat(f.yvalue.value);
+        data[0] = xval;
+        data[1] = yval;
+        plot1.drawSeries({}, seriesIndex);
+        return false;
+    }
+    
+    function updateSeries() {
+        plot1.series[2].data = [[1,4], [2,6], [3,4], [4,1], [5,7]];
+        plot1.drawSeries({}, 2);
+        return false;
+    }
+  
+  $(document).ready(function(){
+
+    var l1 = [2, 3, 1, 4, 3];
+    var l2 = [1, 4, 3, 2, 5];
+    var l3 = [7, 9, 11, 6, 8];
+
+
+    plot1 = $.jqplot('chart1', [l1, l2, l3], {
+        legend:{show:true},
+        series:[{label:'lions'}, {label:'tigers'}, {label:'bears'}]
+    });
+
+  });
+  </script>
+  </head>
+  <body>
+<?php include "nav.inc"; ?>
+<p>This example demonstrates how to update a point in a series and then redraw just that series.  You can select a series, a point and change it's x and y value with the form below the chart.</p>
+
+    <div id="chart1" style="margin-top:20px; margin-left:20px; width:360px; height:300px;"></div>
+    
+    <form action="#" onsubmit="return updatePoint();">
+        Series: <select name="seriesId">
+            <option value="0">lions</option>
+            <option value="1">tigers</option>
+            <option value="2">bears</option>
+        </select>
+        Point: <select name="pointId">
+            <option value="0">first</option>
+            <option value="1">second</option>
+            <option value="2">third</option>
+            <option value="3">fourth</option>
+            <option value="4">fifth</option>
+        </select>
+        X: <input type="text" size="3" name="xvalue" />
+        Y: <input type="text" size="3" name="yvalue" />
+        <input type="submit" name="submit" value="Update" />
+    </form>
+
+<p>The mechanism to update data in a series and then redraw the series is simple.  update the data in the "plot.series[seriesIndex].data[dataIndex]" and then redraw just that series with "plot.drawSeries(options, seriesIndex);"  Here is the relavent code which updates the series on this chart:</p>
+
+<pre>
+    var f = document.forms[0];
+    var seriesIndex = f.seriesId.selectedIndex;
+    var series = plot1.series[seriesIndex];
+    var data = series.data[f.pointId.selectedIndex];
+    var xval = parseFloat(f.xvalue.value);
+    var yval = parseFloat(f.yvalue.value);
+    data[0] = xval;
+    data[1] = yval;
+    plot1.drawSeries({}, seriesIndex);
+</pre>
+
+<p>You can also update an entire series dataset at once and redraw the series like so:</p>
+
+<pre>
+    plot1.series[2].data = [[1,4], [2,6], [3,4], [4,1], [5,7]];
+    plot1.drawSeries({}, 2);
+</pre>
+
+<p> You can test this by clicking the button below.  You should see the entire "bears" line drop lower on the chart.</p>
+<button onclick="return updateSeries();">Update Series</button>
+
+
+<p> Note that the redrawSeries method does not do any axes scaling or redraw any other elements on the chart.  It is intended to be a lightweight method to redraw just one series.  Also note, if no series Index is passed in as the second parameter to drawSeries, it will redraw all series without rescaling or redrawing other plot elements.</p>
+  </body>
+</html>

File examples/shadowTests.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:400px; height:400px;"></div>
     <div id="chart2" style="margin-top:20px; margin-left:20px; width:400px; height:400px;"></div>
     <div id="chart3" style="margin-top:20px; margin-left:20px; width:400px; height:400px;"></div>

File examples/singlePoint.html

   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 
   </head>
   <body>
+<?php include "nav.inc"; ?>
 <div id="chart" style="height:200px; width:300px;"></div>
   </body>
 </html>

File examples/sparkLine.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="curr_sparkline" style="margin-top:20px; margin-left:20px; width:100px; height:40px;"></div>
   </body>
 </html>

File examples/stackedBar2.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 </script>
 </head>
 <body>
+<?php include "nav.inc"; ?>
 <div id="chart5" class='plot' style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
  
 </body>

File examples/stackedBarCategoryVsLinearAxes.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 </script>
 </head>
 <body>
+<?php include "nav.inc"; ?>
 
 <div id="chart1" class='plot' style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
 <div id="chart2" class='plot' style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>

File examples/stackedFilledLine.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
   </body>
 </html>

File examples/stackedLine.html

 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 </script>
 </head>
 <body>
+<?php include "nav.inc"; ?>
 <div id="chart4" class='plot' style="margin-top:20px; margin-left:20px; width:400px; height:300px;"></div>
  
 </body>

File examples/test.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chartdiv" style="margin-top:20px; margin-left:20px; width:500px; height:300px;"></div>
   </body>
 </html>

File examples/test2.html

  <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.min.js"></script><![endif]-->
 
  <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
 
  <!-- BEGIN: load jquery -->
- <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+ <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
  <!-- END: load jquery -->
 
  <!-- BEGIN: load jqplot -->
  </script>
  </head>
  <body>
+<?php include "nav.inc"; ?>
    <div id="chart" style="margin-top:20px; margin-left:20px; width:1000px; height:300px;"></div>
    <div style="padding-top:20px"><button value="reset" type="button" onclick="$.jqplot.Cursor.resetZoom(plot)">Zoom Out</button></div>
  </body>

File examples/trendlineDragableCustomization.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
 </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart1" style="margin-top:20px; margin-left:20px; width:500px; height:400px;"></div>
     <div id="chart2" style="margin-top:20px; margin-left:20px; width:300px; height:200px;"></div>
   </body>

File examples/verticalLine.html

   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <div id="chart" style="margin-top:20px; margin-left:20px; width:500px; height:300px;"></div>
   </body>
 </html>

File examples/waterfall.html

 <html lang="en">
 <head>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-  <title>Simple Test</title>
+  <title>Waterfall Chart</title>
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
   
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
   <!-- END: load jquery -->
   
   <!-- BEGIN: load jqplot -->
     }
     .jqplot-title {
       font-size: 16px;
-      padding-bottom: 20px;
     }
 	  p {
 	    margin: 20px;
 
 
 plot1 = $.jqplot('chart1', [line1], {
-  title: 'Production Change for Common Crops, 2008 to 2009',
+  title: 'Crop Yield Charnge, 2008 to 2009',
   seriesDefaults:{
     renderer:$.jqplot.BarRenderer, 
     rendererOptions:{
 
 
 plot2 = $.jqplot('chart2', [line1], {
-  title: 'Production Change for Common Crops, 2008 to 2009',
+  title: 'Crop Yield Charnge, 2008 to 2009',
   seriesColors:['#333333', '#999999', '#3EA140', '#3EA140', '#3EA140', '#783F16', '#783F16', '#783F16', '#333333'],
   seriesDefaults:{
     renderer:$.jqplot.BarRenderer, 
   </script>
   </head>
   <body>
+<?php include "nav.inc"; ?>
     <p>Waterfall chart using default bar colors.</p>
-    <div id="chart1" style="margin-top:20px; margin-left:20px; width:400px; height:500px;"></div>
+    <div id="chart1" style="margin-top:20px; margin-left:20px; width:350px; height:350px;"></div>
     <p>Waterfall chart using custom colors and "useNegativeColors" set to "false".</p>
-    <div id="chart2" style="margin-top:20px; margin-left:20px; width:400px; height:500px;"></div>
+    <div id="chart2" style="margin-top:20px; margin-left:20px; width:350px; height:350px;"></div>
   </body>
 </html>

File examples/zoom1.html

+<!DOCTYPE html>
 <html>
 <head>
   <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
+  <link rel="stylesheet" type="text/css" href="examples.css" />
   
   <!--[if IE]><script language="javascript" type="text/javascript" src="../src/excanvas.min.js"></script><![endif]-->
   <!-- BEGIN: load jquery -->
-  <script language="javascript" type="text/javascript" src="../src/jquery-1.3.2.min.js"></script>
+  <script language="javascript" type="text/javascript" src="../src/jquery-1.4.1.min.js"></script>
 
   <!-- END: load jquery -->
   
 
 
     plot = $.jqplot('chart1', [goog], { 
-        title: 'Google, Inc.', 
+        // title: 'Google, Inc.', 
         series: [{ 
-            label: 'Google, Inc.', 
+            // label: 'Google, Inc.', 
             neighborThreshold: -1 
         }], 
         axes: { 
                 tickOptions:{formatString:'$%.2f'} 
             } 
         }, 
-        cursor:{zoom:true, showTooltip:false} 
+        cursor:{zoom:true} 
     });
 });
 </script>
 		
 </head>
 <body>
+<?php include "nav.inc"; ?>
 
-<div class="jqPlot" id="chart1" style="height:380px; width:480px;"></div>
+<div class="jqPlot" id="chart1" style="height:300px; width:400px;"></div>
 
 <button onclick="plot.resetZoom()">Reset</button>
 </body>