[Solved] How to make donut chart clickable

by


Use chart: { type: 'pie' } with innerSize: '50%' to create a donut.

Here is an example:

Highcharts.chart('container', {
  chart: {
    type: 'pie'
  },
  title: {
    text: 'Click points to go to URL'
  },
  xAxis: {
    type: 'category'
  },
  plotOptions: {
    series: {
      innerSize: '50%',
      cursor: 'pointer',
      point: {
        events: {
          click: function() {
            location.href="https://en.wikipedia.org/wiki/" +
              this.options.key;
          }
        }
      }
    }
  },

  series: [{
    
    data: [{
      y: 29.9,
      name: 'USA',
      key: 'United_States'
    }, {
      y: 71.5,
      name: 'Canada',
      key: 'Canada'
    }, {
      y: 106.4,
      name: 'Mexico',
      key: 'Mexico'
    }]
  }]
});
<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 300px"></div>

Highcharts has a very good documentation, so I advise you to read it first so you will be able to answer such questions by yourself.

solved How to make donut chart clickable