Question

我正在从包含div的数据ID传入的json_encoded数组中创建我的高图表对象。

$('div.filter_pie_chart').each(function( index ) {
    $(this).highcharts($(this).data("params"));
    });

我想使用以下符号来侦听饼图的点击事件。这可能吗？

$(document).on('click','.high_chart_point_object', function (event) {
       return false;
});

Answer 1

我认为documentation link就是你所需要的。

这是JsFiddle。

$(function () {
    // create the chart
    var mychart = $('#container').highcharts({
        chart: {
            events: {
                click: function(event) {
                    alert ('x: '+ event.xAxis[0].value +', y: '+
                          event.yAxis[0].value);
                }
            }        
        },
        xAxis: {
        },

        series: [{
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
        }]
    });
});

我认为这些行也应该有效（未经测试，但它与你的符号相似）：

$('.high_chart_point_object').highcharts({
  chart: {
    events: {
      click: function(event) {
        return false;
      }
    }        
  }
});

如果您想动态更改选项，请选择以下解决方案：

var options = mychart.options;
options.chart.events.click = function () {alert('do what you want')};
mychart = new Highcharts.Chart(options);

这是另一个JsFiddle。

Answer 2

是的，这应该有三种方式：

一个是使用plotOpttions.pie.point.events.click ant你需要的呼叫功能。 Reference。
另一个是在挖掘DOM元素后来自Highcharts的Element.on()函数 - 它与使用$().on()，reference相同。
如果您确实需要$().on()，则可以使用point.element，为您提供示例：http://jsfiddle.net/UWZAe/

第三种情况的代码：

    chart: {
        events: {
            load: function() {
                var chart = this,
                    pie = chart.series[0],
                    pieData = pie.data,
                    dLen = pieData.length;

                for(var i = 0; i < dLen; i++){
                    var slice = pieData[i];

                    console.log(slice, $(slice.graphic)); 
                }  
            }
        }
    }

单击事件监听的高图表

2 个答案: