在 lat-lon 地图点 Highmaps 中也可以看到工具提示

Question

我正在与 Highmaps 合作，但在使用 lat-lon 位置绘制的地图点上遇到了工具提示问题。

一切都是正确的，但工具提示是针对离鼠标光标最近的点。 这导致即使在地图的白色容器区域也启用显示工具提示。

当地图上有多个经纬度点时，这会导致问题。

我尝试在该点上使用 Mouse-Over 和 Mouse-out 事件，但结果相同，从鼠标非常远的地方检测到点。

Highmaps lat-lon 演示中也可以看到该问题。

http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/maps/demo/mappoint-latlon/

[<script src="https://cdnjs.cloudflare.com/ajax/libs/proj4js/2.3.6/proj4.js"></script>
<script src="https://code.highcharts.com/maps/highmaps.js"></script>
<script src="https://code.highcharts.com/maps/modules/exporting.js"></script>
<script src="https://code.highcharts.com/maps/modules/offline-exporting.js"></script>
<script src="https://code.highcharts.com/mapdata/countries/gb/gb-all.js"></script>

<div id="container"></div>


// Initiate the chart
Highcharts.mapChart('container', {

    chart: {
        map: 'countries/gb/gb-all'
    },

    title: {
        text: 'Highmaps basic lat/lon demo'
    },

    mapNavigation: {
        enabled: true
    },

    tooltip: {
        headerFormat: '',
        pointFormat: '<b>{point.name}</b><br>Lat: {point.lat}, Lon: {point.lon}'
    },

    series: \[{
        // Use the gb-all map with no data as a basemap
        name: 'Basemap',
        borderColor: '#A0A0A0',
        nullColor: 'rgba(200, 200, 200, 0.3)',
        showInLegend: false
    }, {
        name: 'Separators',
        type: 'mapline',
        nullColor: '#707070',
        showInLegend: false,
        enableMouseTracking: false
    }, {
        // Specify points using lat/lon
        type: 'mappoint',
        name: 'Cities',
        color: Highcharts.getOptions().colors\[1\],
        data: \[{
            name: 'London',
            lat: 51.507222,
            lon: -0.1275
        }, {
            name: 'Birmingham',
            lat: 52.483056,
            lon: -1.893611
        }, {
            name: 'Leeds',
            lat: 53.799722,
            lon: -1.549167
        }, {
            name: 'Glasgow',
            lat: 55.858,
            lon: -4.259
        }, {
            name: 'Sheffield',
            lat: 53.383611,
            lon: -1.466944
        }, {
            name: 'Liverpool',
            lat: 53.4,
            lon: -3
        }, {
            name: 'Bristol',
            lat: 51.45,
            lon: -2.583333
        }, {
            name: 'Belfast',
            lat: 54.597,
            lon: -5.93
        }, {
            name: 'Lerwick',
            lat: 60.155,
            lon: -1.145,
            dataLabels: {
                align: 'left',
                x: 5,
                verticalAlign: 'middle'
            }
        }\]
    }\]
});]

当鼠标正好在点上时，有什么方法可以显示工具提示。

Answer 1

您正在寻找stickyTracking。

鼠标事件的粘性跟踪。如果为 true，则在鼠标移到另一个系列上或移出绘图区域之前，不会触发系列上的 mouseOut 事件。当为 false 时，当鼠标离开系列图形或标记周围的区域时，将触发系列上的 mouseOut 事件。这也意味着不共享时的工具提示。当 stickyTracking 为 false 且 tooltip.shared 为 false 时，在系列之间移动鼠标时工具提示将被隐藏。线和区域类型系列默认为 true，但列、饼图等默认为 false。

所以通过像这样设置 plotOptions，它将被禁用：

plotOptions: {
  mappoint: {
    stickyTracking: false,
  }
}

工作示例： http://jsfiddle.net/ewolden/qgoc1p5z/