Highcharts 增加了标记的悬停检测

Question

我正在尝试增加 HighCharts 中散点的悬停检测半径，但我没有找到官方方法。
本质上，我希望每个点都有一个不可见的半径，当鼠标进入时会触发悬停效果。

我知道 stickyTracking 存在，但就我而言，感觉有点太粘。
然而，关闭它意味着在工具提示出现之前必须非常精确。

StickyTracking 关闭：https://jsfiddle.net/wsxkLn25

StickyTracking 开启：https://jsfiddle.net/wsxkLn25/1/

有没有办法在鼠标进入点的实际半径之前触发悬停效果stickyTracking？

Answer 1

Highcharts 中没有这样的功能，但您可以通过启用粘滞跟踪来实现它，并且仅当悬停点离鼠标光标足够近时才处理内部 getHoverData 方法。示例：

(function(H) {
    H.wrap(H.Pointer.prototype, 'getHoverData', function(proceed, existingHoverPoint, existingHoverSeries, series, isDirectTouch, shared, e) {
        var hoverData = proceed.apply(this, Array.prototype.slice.call(arguments, 1));
        var RADIUS = 20;
        var point = hoverData.hoverPoint;
        var chart = this.chart;
        var plotX;
        var plotY;

        if (point) {
            plotX = point.plotX + chart.plotLeft;
            plotY = point.plotY + chart.plotTop;

            if (
                plotX + RADIUS > e.chartX && plotX - RADIUS < e.chartX &&
                plotY + RADIUS > e.chartY && plotY - RADIUS < e.chartY
            ) {
                return hoverData;

            } else if (chart.hoverPoint) {
                chart.hoverPoint.setState('');
                chart.tooltip.hide();
            }
        }

        return {
            hoverPoint: null,
            hoverPoints: [],
            hoverSeries: null
        };
    });
}(Highcharts));

现场演示： https://jsfiddle.net/BlackLabel/sb35j0ov/

文档： https://www.highcharts.com/docs/extending-highcharts/extending-highcharts

Highcharts 增加了标记的悬停检测

Highcharts increase hover detection for markers

javascript

highcharts