xAxis series option for line chart - Javascript highcharts

Javascript examples for highcharts:Line Chart

  1. HOME
  2. Javascript
  3. highcharts
  4. Line Chart

Description

xAxis series option for line chart

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://code.jquery.com/jquery-1.8.3.js"></script> 
      <script type="text/javascript">
(function($){ // encapsulate jQuery
$(function() {/*from   w  ww  .  ja  va2s  .com*/
     var detailChart;
    var start = new Date(2013,1,12,0,0,0,0);
    var end = new Date(2013,1,14,0,0,0,0);
    var seriesOptions = [];
    seriesOptions.push({
       name: "Temp",
       data: [[1360644242000, 70.0],[1360654682000, 70.0],[1360656842000, 70.0],[1360679882000, 66.0],[1360727882000, 70.0]],
       type: 'spline'
    });
    detailChart = new Highcharts.Chart({
        chart: {
            renderTo: 'detail-container',
            zoomType: 'x',
       events: {
          selection: function(event) {
                console.log(event.xAxis);
         if (event.xAxis[0]) {
                console.log(event.xAxis[0].min);
                }
          }
           }
        },
        xAxis: {
             type: 'datetime'
        },
        series: seriesOptions
    });
});
})(jQuery);

      </script> 
   </head> 
   <body> 
      <script src="https://code.highcharts.com/highcharts.js"></script> 
      <div id="detail-container" style="height: 700px"></div>  
   </body>
</html>

Related Tutorials