Question

我正在使用HighCharts Custom Events Module（但即使不使用它我的问题仍然是相同的）我将相同的事件/函数绑定到我的每个元素（系列，yAxis等等）。。）它正在重复：

...
yAxis: [
{
    labels: {
        format: "{value}°C"
    },
    title: {
        text: "Temperature",        
        events: {
            click: function (event) {
                foo(event);
            },
            dblclick: function (event) {
                foo(event);
            },
            contextmenu: function (event) {
                foo(event);
            }
        }
    },
    id: "temperature",
    labels: {
        events: {
            click: function (event) {
                bar(event);
            },
            dblclick: function (event) { 
                bar(event);
            },
            contextmenu: function (event) {
                bar(event);
            }
        }
    }
},
    {
    labels: {
        format: "{value}km"
    },
    title: {
        text: "Width",      
        events: {
            click: function (event) {
                foo(event);
            },
            dblclick: function (event) {
                foo(event);
            },
            contextmenu: function (event) {
                foo(event);
            }
        }
    },
    id: "temperature",
    labels: {
        events: {
            click: function (event) {
                bar(event);
            },
            dblclick: function (event) { 
                bar(event);
            },
            contextmenu: function (event) {
                bar(event);
            }
        }
    }
}
...
],

我甚至允许使用添加更多（再次，yAxis，系列等......＆＃34;渲染后＃34;）。

这就是为什么我想知道是否有更多的全球方式＆＃34;将事件绑定到给定图表的每个yAxis，series，....类似于

的东西

Highcharts.setOptions({ // Apply to all charts
    series: {    //hypothetically
        events: {
            click: function (event) {
                foo(event)
            }
        }
    }
});

我还想过在渲染一个系列之后创建某种更新回调，比如

    Highcharts.setOptions({ // Apply to all charts
        events: {
            addSeries: function (event) {
                event.update(
                    {events{
                        click: function(event){ 
                            foo(event); 
                        }
                    }
                }, false);
            }
        }
    });

但这比任何事情都更糟糕

这个问题并不重要，它更多是出于好奇，但与此同时，它会让我（可怕的）代码更清晰^^

感谢您的阅读。

Answer 1

可以在plotOptions.series属性中指定将应用于所有系列的选项。使用Highcharts.setOptions功能更改每个图表的默认选项：

var foo = function() {
  console.log("contextmenu event");
}

Highcharts.setOptions({
  xAxis: {
    labels: {
      events: {
        contextmenu: foo
      }
    }
  },   
  plotOptions: {
    series: {
      events: {
        contextmenu: foo
      },
      dataLabels: {
        enabled: true,
        events: {
          contextmenu: foo
        }
      }
    }
  }
});

var chart = Highcharts.chart('container', {

  chart: {
    type: 'column'
  },

  xAxis: [{
    labels: {
      style: {
        color: '#bada55'
      }
    }
  }, {}],

  series: [{
    data: [1, 2]
  }, {
    data: [3, -4],
    xAxis: 1
  }]
});

现场演示： http://jsfiddle.net/BlackLabel/Lxrg3hsy/

API参考： https://api.highcharts.com/class-reference/Highcharts#setOptions

共享事件highcharts

1 个答案: