监听在各个轴标签上的点击/悬停

Listen for click / hover on individual axis labels

我正在寻找一种方法来在将鼠标悬停在任何图表中时更改单个系列标签的值(或格式)。

目前我只能访问整个轴,我找不到 getter 用于单个标签的方法来附加监听器。

xAxis.labels().listen('mouseOver', function(e) {
    console.log(this, e.target);
});

这个 jsfiddle 是我得到的(见控制台日志),这个以及 event.target 引用整个轴而不是标签:

https://jsfiddle.net/robstarbuck/pbhd4b7L/9/

我们的 API 这里有点复杂,但我们正在努力改进它。这是您要找的吗?

    var labelIndex = e.labelIndex;
    var label = this.getLabel(labelIndex);
    label.fontColor('red');
    label.draw();

https://jsfiddle.net/pbhd4b7L/10/

确实,缓存和 format() 函数存在一个小错误,我们的开发团队已修复,因此请检查工作示例:

var labelIndex = e.labelIndex;
var label = this.getLabel(labelIndex);
var value = xAxis.scale().ticks().get()[labelIndex];
label.format(value * 2);

https://jsfiddle.net/pbhd4b7L/13/ – 它还展示了如何使用刻度值:

目前它从分支中获取 js,但此修复将包含在即将发布的版本中 – 7.14.0 版本(ETA:2017 年 5 月)

此问题已在 7.14.0 版本中修复,请使用此代码:

  xAxis.labels().listen('mouseOver', function(e) {
    var labelIndex = e.labelIndex;
    var label = this.getLabel(labelIndex);
    var value = xAxis.scale().ticks().get()[labelIndex];
    label.format(value * 2);
    label.fontColor('red');
    label.draw();
  });

最新版本:https://jsfiddle.net/2t08ahkg/3/