title: Manually activate Drill down in Highcharts chart by clicking on another chart
body: <p>I'm using highcharts to draw two charts in angular(but I don;t think that is important or this problem) - pie chart and bar chart. I have two charts defined and I want to trigger drill down in bar chart when I click on pie chart. Also, drill down should be preformed for same data. 
  These are chart settings:</p>
  
  <pre><code>import Highcharts from 'highcharts/highstock';
  
  export const MEDIA_CHART = {
  chart: {
    height: 350,
    type: 'pie',
    width: 300
  },
  drilldown: {
   allowPointDrilldown: true
  },
  legend: {
   borderWidth: 0,
   enabled: true,
   symbolRadius: 0,
   title: {
    text: ''
  },
  useHTML: true,
  /*eslint-disable*/
  labelFormatter: function () {
    return '&lt;div style="max-width:150px;"&gt;&lt;span style="width:100%;display:block;text-align:center;"&gt;' + this.name + '&lt;/span&gt;&lt;span&gt;' + Highcharts.numberFormat(this.y, 2, ',', '.') + '€&lt;/span&gt;&lt;/div&gt;';
  }
  /*eslint-enable*/
  },
  plotOptions: {
   pie: {
    center: ['48%', '42%'],
    showInLegend: true
   },
  series: {
    allowPointSelect: true,
    cursor: 'pointer',
    /*eslint-disable*/
    events: {
      click: function (event) {
        console.log(TACTIC_CHART.chart.drilldownLevels.length);
      }
    },
    /*eslint-enable*/
    dataLabels: {
      enabled: true,
      format: '&lt;b&gt;{point.name}&lt;/b&gt;: {point.percentage:.1f} %'
    }
  }
  },
   series: [{
   size: '95%',
   innerSize: '60%'
  
  }],
  tooltip: {
  borderWidth: 0,
  backgroundColor: '#37474F',
  headerFormat: '',
  pointFormat: '{point.name}: {point.y:,.2f}€',
  style: {
    color: '#fff',
    padding: 0,
    fontWeight: 700
  },
  useHTML: true
  }
  };
  
  export const TACTIC_CHART = {
  chart: {
   type: 'bar',
   height: '100%'
  },
  colors: ['#969696', '#F1292E', '#A0CB0E'],
  drilldown: {
    allowPointDrilldown: true
  },
  xAxis: {
  title: {
    text: null
  },
   type: 'category'
  },
  yAxis: {
   min: 0,
   title: {
    text: 'Budget €',
    align: 'high'
  },
  labels: {
    overflow: 'justify'
  }
  },
  tooltip: {
    enabled: true,
    borderWidth: 0,
    backgroundColor: '#37474F',
    headerFormat: '',
    pointFormat: '{series.name}: {point.y:,.2f}€',
    style: {
    color: '#fff',
    padding: 0,
    fontWeight: 700
  },
    useHTML: true,
    valueSuffix: ' €'
  },
  title: {
  align: 'left'
  },
  plotOptions: {
  bar: {
    dataLabels: {
      enabled: true,
      /*eslint-disable*/
      formatter:  function () {
        return Highcharts.numberFormat(this.y, 2, ',', '.') + '€';
      }
      /*eslint-enable*/
    }
   }
  },
  legend: {
    enabled: true,
    layout: 'horizontal',
    align: 'center',
    verticalAlign: 'top',
    floating: true,
    borderWidth: 1,
    backgroundColor: '#FFFFFF',
    shadow: true
  }
  };
  </code></pre>
  
  <p>In this part I catch click on pie chart:</p>
  
  <pre><code>events: {
      click: function (event) {
        console.log(TACTIC_CHART.chart.drilldownLevels.length);
      }
    },
  </code></pre>
  
  <p>I tried to get this but I get error <code>can't get length of undefined</code>. I tried every possible solution that I found, but without any luck. Problem is that I need to preserve data for bar chart, so I can't redraw it, I need to activate drill down if it's possible. Thanks everyone for help!</p>