Source

jqplot / examples / resetAxisTicks.html

<!DOCTYPE html>

<html lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>Single Negative Point</title>
  <!--[if lt IE 9]><script language="javascript" type="text/javascript" src="../src/excanvas.js"></script><![endif]-->
  
  <link rel="stylesheet" type="text/css" href="../src/jquery.jqplot.css" />
  
  <!-- BEGIN: load jquery -->
  <script language="javascript" type="text/javascript" src="../src/jquery-1.5.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.ohlcRenderer.js"></script>

  <!-- END: load jqplot -->
<script language="javascript" type="text/javascript">
  
$(document).ready(function(){
      $.jqplot.config.enablePlugins = true;
	  //$.jqplot.config.catchErrors = true;
    
    line1 = [1, 3, 5, 7, 9];
    plot1 = $.jqplot('chart1',[line1], {});
	ohlc = [['1/24/2011 8:00am', 607.57, 612.49, 601.23, 611.08],
['1/24/2011 9:00am', 639.58, 641.73, 611.36,   611.83],
['1/24/2011 10:00am', 632.21, 634.08, 623.29,   626.77],
['1/24/2011 11:00am', 642.12, 642.96, 629.66,   631.75],
['1/24/2011 12:00pm', 626.06, 641.99, 625.27,   639.63],
['1/24/2011 1:00pm', 617.4, 624.27, 617.08,   624.18],
['1/24/2011 2:00pm', 616.97, 619.67, 614.16,   616.69],
['1/24/2011 3:00pm', 619.35, 619.35, 614.77,   616.87],
['1/24/2011 4:00pm', 617.71, 618.8, 614.5,  616.01],
['1/24/2011 5:00pm', 614.8, 615.39, 608.56,   614.21]];
	ohlc = [['8:00am', 607.57, 612.49, 601.23, 611.08],
['9:00am', 639.58, 641.73, 611.36,   611.83],
['10:00am', 632.21, 634.08, 623.29,   626.77],
['11:00am', 642.12, 642.96, 629.66,   631.75],
['12:00pm', 626.06, 641.99, 625.27,   639.63],
['1:00pm', 617.4, 624.27, 617.08,   624.18],
['2:00pm', 616.97, 619.67, 614.16,   616.69],
['3:00pm', 619.35, 619.35, 614.77,   616.87],
['4:00pm', 617.71, 618.8, 614.5,  616.01],
['5:00pm', 614.8, 615.39, 608.56,   614.21]];

    plot2 = $.jqplot('chart2',[ohlc],{
      axes: {
          xaxis: {
			  numberTicks: 7,
			  min: '7:00am',
			  max: '7:00pm',
              renderer:$.jqplot.DateAxisRenderer,
              tickOptions:{formatString:'%#I:%M%p'}, 
          },
          yaxis: {
		      min: 590,
			  max: 650,
              tickOptions:{formatString:'%.2f'}
          }
      },
      series: [{renderer:$.jqplot.OHLCRenderer, rendererOptions:{candleStick:true}}]
    });
    
});

function resetXTicks(plot, arr) {
	// first reset the tick values, labels, scaling function.
	plot.axes.xaxis.renderer.resetTickValues.call(plot.axes.xaxis, arr);
	// now redraw the (all of the) series.
	// could just redraw specific series if had mutliple series attached to multiple axes.
	plot.drawSeries();
};

function resetYTicks(plot, arr) {
	// first reset the tick values, labels, scaling function.
	plot.axes.yaxis.renderer.resetTickValues.call(plot.axes.yaxis, arr);
	// now redraw the (all of the) series.
	// could just redraw specific series if had mutliple series attached to multiple axes.
	plot.drawSeries();
};

function resetXYTicks(plot, xarr, yarr) {
	// first reset the tick values, labels, scaling function.
	plot.axes.xaxis.renderer.resetTickValues.call(plot.axes.xaxis, xarr);
	plot.axes.yaxis.renderer.resetTickValues.call(plot.axes.yaxis, yarr);
	// now redraw the (all of the) series.
	// could just redraw specific series if had mutliple series attached to multiple axes.
	plot.drawSeries();
};


</script>

  </head>
  <body>
<?php include "nav.inc"; ?>
<div id="chart1" style="height:200px; width:400px;"></div>
<div id="chart2" style="height:200px; width:400px;"></div>
  </body>
</html>