Drill down on bubbles

HTML

<script src="https://getfirebug.com/firebug-lite-debug.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/drilldown.src.js"></script>

<div id="container" style="width: 600px; height: 400px; margin: 0 auto;"></div>

JavaScript

Highcharts.chart('container', {

  chart: {
    type: 'bubble',
    plotBorderWidth: 1,
    events: {
     drilldown: function(e) {
        console.log('drill down series= ' + e.point.series.name);
      }
    }
  },


  xAxis: {
    gridLineWidth: 1
  },

  yAxis: {
    startOnTick: false,
    endOnTick: false
  },

  plotOptions: {
    bubble: {
      minSize: 3,
      maxSize: 50
    }
  },

  series: [{
    name: 'Europe',
    data: [{
      x: 9,
      y: 81,
      z: 15,
      drilldown: true
    }, {
      x: 98,
      y: 5,
      z: 19,
      drilldown: true

    }, {
      x: 20,
      y: 20,
      z: 23,
      drilldown: false
    }, {
      x: 51,
      y: 50,
      z: 13,
      drilldown: true
    }]
  }, {
    name: 'Asia',
    data: [{
      x: 41,
      y: 22,
      z: 14,
      drilldown: true
    }, {
      x: 58,
      y: 24,
      z: 20,
      drilldown: true

    }, {
      x: 78,
      y: 37,
      z: 25,
      drilldown: true
    }, {
      x: 55,
      y: 56,
      z: 10,
      drilldown: true
    }]

  }]

});