Highcharts Demo

author(s): Torstein Hønsi

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/highcharts-more.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>

<div id="container" style="min-width: 400px; max-width: 450px; height: 400px; margin: 0 auto"></div>

JavaScript

Highcharts.chart('container', {
  chart: {
    polar: true,
    type: 'area',
    backgroundColor: 'transparent',
    events: {
      load: function() {
        var chart = this,
          yAxis = chart.yAxis[0],
          series = chart.series,
          newYTicks = [0];

        series.forEach(function(ser, serIndex) {
          ser.points.forEach(function(point, pointIndex) {
            if (point.y > 1000) {
              newYTicks.push(point.y);
            }
          });
        });

        yAxis.update({
          tickPositions: newYTicks
        });
      }
    }
  },
  exporting: {
    buttons: {
      contextButton: {
        enabled: false
      }
    }
  },
  legend: {
    itemStyle: {
      color: '#c4c4c4',
      fontWeight: 'bold'
    }
  },
  credits: {
    enabled: false
  },
  title: {
    style: {
      display: 'none'
    }
  },
  plotOptions: {
    series: {
      lineColor: '#808080'
    }
  },
  pane: {
    size: '80%',
  },
  xAxis: {
    categories: ['Win Rate', 'Kills', 'Deaths', 'Assits', 'Minions Killed', 'Gold Earned', 'Damage Dealt'],
    tickmarkPlacement: 'on',
    lineWidth: 0,
    gridLineColor: "#808080",
    gridLineDashStyle: "Solid",
    gridLineWidth: 2,
    labels: {
      style: {
        color: '#c4c4c4',
        font: '11px Trebuchet MS, Verdana, sans-serif'
      }
    }
  },
  yAxis: {
    gridLineInterpolation: 'polygon',
    lineWidth: 0,
    min: 0,
    gridLineColor: "#808080",
    gridLineDashStyle: "Solid",
    gridLineWidth: 2,
    showLastLabel: true,
    labels: {
      formatter: function() {
        return this.value ? Highcharts.numberFormat(this.value / 1000, 2, '.', '') + 'K' : 0;
      },
      style: {
        color: '#c4c4c4',
        font: '11px Trebuchet MS, Verdana, sans-serif'
      }
    }
  },
  tooltip: {
    shared: true,
    formatter: function() {
        var points = this.points,
          each = Highcharts.each,
          txt = '<span style="font-size: 10px">' + points[0].key +...