Highcharts Demo

author(s): Torstein Hønsi

by Black Label

HTML

<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>

<div id="container"></div>

JavaScript

Highcharts.chart('container', {

  chart: {
    polar: true,
    events: {
      load: function() {
        var chart = this,
          max = chart.yAxis[0].max;
        chart.addSeries({
          type: 'column',
          data: [{
            y: max,
            color: 'rgba(255, 255, 0, 0.2)'
          }, {
            y: max,
            color: 'rgba(255, 0, 255, 0.2)'
          }, {
            y: max,
            color: 'rgba(0, 255, 255, 0.2)'
          }, {
            y: max,
            color: 'rgba(255, 0, 0, 0.2)'
          }, {
            y: max,
            color: 'rgba(0, 255, 0, 0.2)'
          }, {
            y: max,
            color: 'rgba(0, 0, 255, 0.2)'
          }, {
            y: max,
            color: 'rgba(130, 70, 150, 0.2)'
          }, {
            y: max,
            color: 'rgba(0, 0, 0, 0.2)'
          }],
          pointPadding: 0,
          groupPadding: 0,
          zIndex: 0,
          showInLegend: false,
          enableMouseTracking: false,
          animation: false
        })
      }
    }
  },

  xAxis: {
    type: 'category',
    labels: {
      formatter: function() {
        return this.pos * 45
      }
    }
  },

  yAxis: {
    maxPadding: 0
  },

  series: [{
    data: [1, 2, 3, 4, 5, 6, 7, 8],
    zIndex: 1
  }]

});