chart tick interval - Javascript highcharts

Javascript examples for highcharts:Tick

  1. HOME
  2. Javascript
  3. highcharts
  4. Tick

Description

chart tick interval

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <title>Highcharts Demo</title> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
      <script type="text/javascript">
$(function () {/*from w  w  w .  ja  va  2s .co m*/
    var chart = new Highcharts.Chart({
        chart: {
            renderTo: 'container',
            zoomType: 'xy',
            marginLeft: 50,
            marginBottom: 90
        },
        yAxis: {
            reversed: true,
        },
        plotOptions: {
            series: {
                stacking: 'normal'
            }
        },
        xAxis: {
            opposite: true
        },
        series: [{
            name: '01-Jan-2014',
            data: [
                [28, 10],
                [30, 0]
            ]
        }]
    });
$('#xint').change(function(){
   setTimeout(function() { console.log($('#xint').val());},10);
            // This is not working
            var dummy = parseFloat($('#xint').val());
           // where as is working..
           //  var dummy = 0.2;
            chart.xAxis[0].options.tickInterval = dummy ;
            chart.xAxis[0].isDirty = true;
            chart.redraw();
});
});

      </script> 
   </head> 
   <body> 
      <script src="https://code.highcharts.com/highcharts.js"></script> 
      <div id="container" style="height: 400px"></div> 
      <input id="xint" type="number">  
   </body>
</html>

Related Tutorials