Column chart with pointIntervalUnit month - Javascript highcharts

Javascript examples for highcharts:Chart Point

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

Description

Column chart with pointIntervalUnit month

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <meta name="viewport" content="width=device-width, initial-scale=1"> 
      <script type="text/javascript">
    window.onload=function(){/*from  w  w w. ja  va  2  s .  c o m*/
Highcharts.chart('container', {
        chart: { type: 'column' },
        title: {
            text: 'Month columns'
        },
        xAxis: {
            type: 'datetime',
        },
        legend: {
            enabled: false
        },
        plotOptions: {
            column: {
                groupPadding: 0,
                pointPadding: 0,
                borderWidth: 0,
                grouping: false
            }
        },
        series: [{
            pointIntervalUnit: 'month',
            pointPadding: -0.42,
            groupPadding: 0,
            name: 'Test',
            negativeColor: 'rgb(223,83,83)',
            data: [{x: Date.UTC(2016,11), y:-1000},{x:Date.UTC(2017,0), y:-500}, {x:Date.UTC(2017,1), y: 500}, {x:Date.UTC(2017,2), y: 300}],
        }]
    });
    }

      </script> 
   </head> 
   <body> 
      <script src="https://github.highcharts.com/highcharts.src.js"></script> 
      <div id="container" style="height: 400px"></div>  
   </body>
</html>

Related Tutorials