如何在Highcharts中禁用最近点查找、保留点点击并仅精确悬停时点高亮？

要实现仅精确悬停在数据点上才高亮、禁用最近点查找、保留点点击事件的效果，需要针对Highcharts的核心配置做调整，以下是可行方案：

Highcharts.chart('container', {
    chart: {
        type: 'line'
    },
    plotOptions: {
        series: {
            // 禁用最近点查找，避免鼠标靠近时自动选中点
            findNearestPointBy: false,
            point: {
                events: {
                    click: function() {
                        alert('Point clicked: ' + this.y);
                    }
                }
            },
            // 配置标记点的高亮状态，仅当精确悬停时触发
            marker: {
                states: {
                    hover: {
                        enabled: true,
                        // 自定义高亮样式，可选
                        radius: 6,
                        fillColor: '#ff0000'
                    },
                    // 确保非悬停状态无高亮
                    inactive: {
                        enabled: false
                    }
                }
            }
        }
    },
    tooltip: {
        // 按需开启/关闭tooltip，若需要仅在点上显示，可设置followPointer: true
        enabled: false
    },
    series: [{
        name: 'Sample Data',
        data: [1, 3, 2, 4, 6, 5]
    }]
});

关键配置说明： #

• findNearestPointBy: false：禁用Highcharts默认的“最近点查找”行为，确保只有鼠标精确落在数据点上时才触发交互。
• marker.states.hover：明确配置悬停时的标记点样式，保证仅精确悬停时高亮；同时通过inactive状态确保非悬停时无额外高亮效果。
• 保留point.events.click：不影响点击事件的触发，满足点击交互需求。

原方案问题分析： #

• 方案1未配置findNearestPointBy: false，导致鼠标靠近数据点时，Highcharts会自动选中最近点并高亮，不符合“仅精确悬停”的要求。
• 方案2设置enableMouseTracking: false会完全禁用所有鼠标交互事件（包括点击），因此点击事件无法触发。

内容的提问来源于stack exchange，提问作者Roman Pelekh