1

我能够创建我的 Highchart:

  chart1 = new Highcharts.Chart(WhateverOptions);

当用户将光标放在一个点上时,我可以动态设置要执行的函数:

   chart1.tooltip.options.formatter = function() {
     return 'Whatever I want to display in the tooltip';
   }

我正在寻找一种方法来指定用户单击某个点时要执行的函数。
我需要动态指定这个函数,就像工具提示一样。
我不想在创建图表时将事件设置为选项的一部分。

任何帮助,将不胜感激。
谢谢你。

4

3 回答 3

4

我在我的应用程序中遇到了类似的情况。

实际上,我使用 json 构建器生成所有数据服务器端,它不允许我在模板中编写纯 javascript。此外,我对跨多个页面的 10 多个不同图表使用相同的模板,但我不想将相同的行为分配给所有这些图表。

因此,我需要访问和编辑图表中所有点的onclick事件。

var chart = $('#graph-container').highcharts();
// Iterate over the chart series in order to assign a point click event option
chart.series.forEach(function(s){
  s.options.point.events = {
    click: function(){
       // Store the point object into a variable
       var $$ = this;
       // Get the corresponding date in the from my x value
       var date = new Date($$.series.points[$$.index].x);
       // Do something with the date found
       console.log(date);
    }
  }
})

这应该适用于 Highcharts 5.x

于 2017-07-19T14:09:16.267 回答
1

Highcharts 在系列对象http://api.highcharts.com/highcharts#series.data.events.click中为您提供点击事件。

plotOptions: {
        series: {
            cursor: 'pointer',
            point: {
                events: {
                    click: function() {
                        alert(this.y);
                    }
                }
            }
        }
    },

要动态添加它,我只需在主图表点击事件中调用一个虚拟函数,它什么都不做,然后重新定义该函数以在您想要添加点击功能时执行您想要的操作。

于 2013-03-26T16:07:17.147 回答
0

对于单个点,您可以使用

    $(chart.series[0].data[0]).on('click', function() {
        alert('First Point Click!');
    });

对于系列中的所有点:

    $(chart.series[0].data).on('click', function() {
        alert('Series Point Click')
    });

这是一个jsfiddle

于 2014-07-30T16:03:51.643 回答