Combine xAxis - Javascript highcharts

Javascript examples for highcharts:Chart Axis

Description

Combine xAxis

Demo Code

ResultView the demo in separate window

<html lang="en">
   <head> 
      <title>  Barbara Laird</title> 
   </head> 
   <body translate="no"> 
      <div id="grafic"> 
      </div> 
      <button id="xd">Click</button> 
      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
      <script src="https://code.highcharts.com/highcharts.js"></script> 
      <script src="https://code.highcharts.com/modules/exporting.js"></script> 
      <script>
      $(document).ready(function () {
  $('#xd').click(function () {
    draw();/*  w w  w  .j  ava2  s .  c  o m*/
  });
});
function draw() {
  var myArray = [];
  myArray = [1, 5, 10, 11, 8];
  $('#grafic').highcharts({
        title: {
            text: 'Sampled Parts'
        },
        xAxis: {
            labels: {
                rotation: -33,
            },
          tickInterval:1
        },
        yAxis: {
            allowDecimals: true,
            min: 0,
            title: {
                text: 'Resultados'
            }
        },
        tooltip: {
            formatter: function () {
                return '<b>' + this.x + '</b><br/>' +
                    this.series.name + ': ' + this.y + '<br/>' +
                    'Total: ' + this.point.stackTotal;
            }
        },
        legend: {
            reversed: true
        },
        plotOptions: {
            column: {
                stacking: 'normal'
            }
        },
        series: [{
            name: 'My Data',
            data: myArray
        }]
    });
}
      //# sourceURL=pen.js
    
      </script>  
   </body>
</html>

Related Tutorials