<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../jquery.jqplot.css" />
<link rel="stylesheet" type="text/css" href="examples.css" />
<!--[if lt IE 9]><script language="javascript" type="text/javascript" src="../excanvas.js"></script><![endif]-->
<!-- BEGIN: load jquery -->
<script language="javascript" type="text/javascript" src="../jquery.js"></script>
<!-- END: load jquery -->
<!-- BEGIN: load jqplot -->
<script language="javascript" type="text/javascript" src="../jquery.jqplot.js"></script>
<script language="javascript" type="text/javascript" src="../plugins/jqplot.cursor.js"></script>
<script language="javascript" type="text/javascript" src="../plugins/jqplot.dateAxisRenderer.js"></script>
<script language="javascript" type="text/javascript" src="../plugins/jqplot.ohlcRenderer.js"></script>
<script language="javascript" type="text/javascript" src="../plugins/jqplot.highlighter.js"></script>
<style type="text/css">
.jqplot-cursor-legend {
width: 160px;
font-family: "Courier New";
font-size: 0.85em;
}
td.jqplot-cursor-legend-swatch {
width: 1.3em;
}
div.jqplot-cursor-legend-swatch {
/* width: 15px;*/
}
</style>
<script type="text/javascript" language="javascript">
$(document).ready(function(){
// $.jqplot.config.enablePlugins = true;
var goog = [["2011-04-25",350.34,353.75,350.3,353.01,9497500,353.01],
["2011-04-21",355,355.13,348.52,350.7,26921800,350.7],
["2011-04-20",343.51,345.75,341.5,342.41,25023800,342.41],
["2011-04-19",333.1,337.98,331.71,337.86,14977800,337.86],
["2011-04-18",326.1,332.23,320.16,331.85,21782100,331.85],
["2011-04-15",333.3,333.64,326.8,327.46,16200200,327.46],
["2011-04-14",334.8,336,332.06,332.42,10778600,332.42],
["2011-04-13",335.02,336.14,332.52,336.13,12365000,336.13],
["2011-04-12",330.49,333.73,330.2,332.4,15201400,332.4],
["2011-04-11",334.06,335.67,330.02,330.8,14248100,330.8],
["2011-04-08",339.92,340.15,333.95,335.06,13483400,335.06],
["2011-04-07",338.1,340.43,336.03,338.08,13337400,338.08],
["2011-04-06",341.22,343.9,337.14,338.04,14376400,338.04],
["2011-04-05",336.99,342.25,336,338.89,17240400,338.89],
["2011-04-04",344.31,344.6,338.4,341.19,16431600,341.19],
["2011-04-01",351.11,351.59,343.3,344.56,14952200,344.56],
["2011-03-31",346.36,349.8,346.06,348.51,9786400,348.51],
["2011-03-30",350.64,350.88,347.44,348.63,11764500,348.63],
["2011-03-29",347.66,350.96,346.06,350.96,12603600,350.96],
["2011-03-28",353.15,354.32,350.44,350.44,11048400,350.44],
["2011-03-25",348.07,352.06,347.02,351.54,16032500,351.54],
["2011-03-24",341.85,346,338.86,344.97,14454000,344.97],
["2011-03-23",339.28,340.22,335.95,339.19,13321300,339.19],
["2011-03-22",342.56,342.62,339.14,341.2,11640100,341.2],
["2011-03-21",335.99,339.74,335.26,339.3,14621500,339.3],
["2011-03-18",337.13,338.2,330,330.67,26900500,330.67],
["2011-03-17",336.83,339.61,330.66,334.64,23550800,334.64],
["2011-03-16",342,343,326.26,330.01,41500400,330.01],
["2011-03-15",342.1,347.84,340.1,345.43,25752900,345.43],
["2011-03-14",353.18,356.48,351.31,353.56,15569900,353.56],
["2011-03-11",345.33,352.32,345,351.99,16824300,351.99],
["2011-03-10",349.12,349.77,344.9,346.67,18126400,346.67],
["2011-03-09",354.69,354.76,350.6,352.47,16189500,352.47],
["2011-03-08",354.91,357.4,352.25,355.76,12725600,355.76],
["2011-03-07",361.4,361.67,351.31,355.36,19504400,355.36],
["2011-03-04",360.07,360.29,357.75,360,16188100,360],
["2011-03-03",357.19,359.79,355.92,359.56,17885300,359.56],
["2011-03-02",349.96,354.35,348.4,352.12,21521100,352.12],
["2011-03-01",355.47,355.72,347.68,349.31,16290600,349.31],
["2011-02-28",351.24,355.05,351.12,353.21,14395500,353.21],
["2011-02-25",345.26,348.43,344.8,348.16,13572100,348.16],
["2011-02-24",344.02,345.15,338.37,342.88,17853600,342.88],
["2011-02-23",338.77,344.64,338.61,342.62,23994800,342.62],
["2011-02-22",342.15,345.4,337.72,338.61,31162700,338.61],
["2011-02-18",358.71,359.5,349.52,350.56,29144900,350.56],
["2011-02-17",357.25,360.27,356.52,358.3,18949400,358.3],
["2011-02-16",360.8,364.9,360.5,363.13,17184200,363.13],
["2011-02-15",359.19,359.97,357.55,359.9,10149100,359.9],
["2011-02-14",356.79,359.48,356.71,359.18,11086300,359.18],
["2011-02-11",354.75,357.8,353.54,356.85,13127600,356.85],
["2011-02-10",357.39,360,348,354.54,33162500,354.54],
["2011-02-09",355.19,359,354.87,358.16,17240900,358.16],
["2011-02-08",353.68,355.52,352.15,355.2,13608600,355.2],
["2011-02-07",347.89,353.25,347.64,351.88,17322200,351.88],
["2011-02-04",343.64,346.7,343.51,346.5,11494300,346.5],
["2011-02-03",343.8,344.24,338.55,343.44,14064200,343.44],
["2011-02-02",344.45,345.25,343.55,344.32,9248400,344.32],
["2011-02-01",341.3,345.65,340.98,345.03,15236900,345.03],
["2011-01-31",335.8,340.04,334.3,339.32,13473100,339.32],
["2011-01-28",344.17,344.4,333.53,336.1,21144900,336.1],
["2011-01-27",343.78,344.69,342.83,343.21,10179500,343.21],
["2011-01-26",342.96,345.6,341.5,343.85,18102700,343.85],
["2011-01-25",336.33,341.44,334.57,341.4,19531000,341.4],
["2011-01-24",326.87,337.45,326.72,337.45,20524400,337.45],
["2011-01-21",333.77,334.88,326.63,326.72,26942900,326.72],
["2011-01-20",336.43,338.3,330.12,332.68,27313900,332.68],
["2011-01-19",348.35,348.6,336.88,338.84,40557600,338.84],
["2011-01-18",329.52,344.76,326,340.65,67178500,340.65],
["2011-01-14",345.89,348.48,344.44,348.48,11030000,348.48],
["2011-01-13",345.16,346.64,343.85,345.68,10599300,345.68],
["2011-01-12",343.25,344.43,342,344.42,10806800,344.42],
["2011-01-11",344.88,344.96,339.47,341.64,15861000,341.64],
["2011-01-10",338.83,343.23,337.17,342.45,16020000,342.45],
["2011-01-07",333.99,336.35,331.9,336.12,11140400,336.12],
["2011-01-06",334.72,335.25,332.9,333.73,10729600,333.73],
["2011-01-05",329.55,334.34,329.5,334,9125700,334],
["2011-01-04",332.44,332.5,328.15,331.29,11038600,331.29],
["2011-01-03",325.64,330.26,324.84,329.57,15897800,329.57]];
plot = $.jqplot('chart1', [goog], {
// title: 'Google, Inc.',
series: [{
renderer: $.jqplot.OHLCRenderer,
rendererOptions: {
candleStick: true,
// bodyWidth: 7
}
}],
axes: {
xaxis: {
renderer:$.jqplot.DateAxisRenderer,
tickOptions:{formatString:'%Y/%#m/%#d %H:%M'}
},
yaxis: {
renderer: $.jqplot.LogAxisRenderer,
tickOptions:{formatString:'$%.2f'}
}
},
cursor:{show:true, zoom:true},
highlighter: {show: true}
});
});
</script>
</head>
<body>
<?php include "nav.inc"; ?>
<div class="jqPlot" id="chart1" style="height:600px; width:1500px;"></div>
<button onclick="plot.resetZoom()">Reset</button>
</body>
</html>