xAxis with negative value in bar chart - Javascript highcharts

Javascript examples for highcharts:Bar Chart

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

Description

xAxis with negative value in bar 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.9.1.js"></script> 
      <script type="text/javascript">
$(document).ready(function() {
    $('#container').highcharts({
        chart: {/*  www. j  a  v  a2s  .  c  o  m*/
            type: 'bar'
        },
        xAxis: [{
            categories: ['A','B','C']
        }, {
            opposite: true,
            categories: ['D','E','F']
        }],
        plotOptions: {
            series: {
                stacking: 'normal'
            }
        },
        series: [{
            xAxis:1,
            data: [-1746181, -1884428, -2089758]
        }, {
            data: [1656154, 1787564, 1981671]
        }]
    });
});

      </script> 
   </head> 
   <body> 
      <script src="https://code.highcharts.com/highcharts.js"></script> 
      <script src="https://code.highcharts.com/modules/exporting.js"></script> 
      <div id="container" style="min-width: 400px; max-width: 800px; height: 400px; margin: 0 auto"></div>  
   </body>
</html>

Related Tutorials