Question

我无法尝试从图例项目点击事件处理程序触发向下钻取事件。在示例中，单击饼图切片时会触发向下钻取，但单击图例项将显示/隐藏切片。

我试图异步加载项目的数据。

  drilldown: function(e) {
      console.log(".....", "on drilldown item", e, this);
      var chart = this
      , serieData = [];
      if (!e.seriesOptions) {
        chart.showLoading('Loading ...');
        setTimeout(function() {
          chart.addSeriesAsDrilldown(e.point, {
            name: 'Some sub item',
            colorByPoint: true,
            data: [{
              name: 'bla',
              y: 56.33
            }, {
              name: 'da da',
              y: 24.03,
              drilldown: true
            }, {
              name: 'ba ba ba',
              y: 10.38,
              drilldown: true
            }]
          });
          chart.hideLoading();
        }
        , 10);
      }
    }
  }

传奇项目处理程序：

  point: {
      events: {
        legendItemClick: function(e) {
          console.log(".....", "clicked legend item", e, this);
          //in drilldown chart = this but how can I get it here?
          //in drilldown e has seriesOptions, not this e
          //in drilldown e has point, not this e
          return false;
        }
      }
    }
  }

Answer 1

您可以通过调用目标的Highcharts点击事件来触发legendItemClick的深入分析。

pie: {
    showInLegend: true,
    point: {
      events: {
        legendItemClick: function(e) {
          if (e.target.drilldown != undefined) {
            e.target.hcEvents.click[0]();         
          } else {
            return false;
          }    
        }
      }
    }
  }

实施例： http://jsfiddle.net/ueetz0b6/8/

您必须检查目标是否有向下钻取，否则呼叫将失败。如果您不调用click事件，则需要返回false，否则将触发默认的图例点击行为。

编辑：这是在Highcharts 4.2.3中测试的。它可能无法在旧版本中使用。

Answer 2

从版本4.2.0（Highcharts.version）开始，您可以使用friggle的回答

不确定e.seriesOptions应该是什么或它在哪里，但是当我有更多时间时会尝试解决它。

我使用了following：

pie: {
    showInLegend: true,
    point: {
      events: {
        legendItemClick: function(e) {
          console.log(".....", "clicked legend item", e, this);
          //in drilldown chart = this but how can I get it here:
          var chart = $('#container').highcharts();//<=calling without parameters
                                                   //causes it to return the chart
          //in drilldown e has seriesOptions, not this e (ignoring now)
          //in drilldown e has point, not this e
          drilldownHandler.call(chart,{point:e.target});
          return false;
        }
      }
    }
  }

HighChart饼图单击图例项以触发向下钻取

2 个答案: