Highmaps hover effect/mouseout 颜色变化

Question

我想完全禁用悬停效果这是代码片段

 series : [{
            data : data,
            mapData: Highcharts.maps['custom/world'],
            joinBy: ['iso-a2', 'code'],
            name: 'Population density',
            states: {
                hover: {
                    enabled:false
                }
            },
            tooltip: {
                valueSuffix: '/km²'
            }
        }]

但是当我鼠标移开时还是有一些颜色效果这是一个 jsfiddle highmaps fiddle（请按上述方式更改系列选项）

如何解决鼠标离开地图点时的颜色效果，任何帮助或参考将不胜感激。

Answer 1

经过一番努力，我得到了上述问题的解决方案，你只需要获取系列数据的所有点对象，并在悬停时给它们提供与当前相同的颜色，但你不能给直接这样上色

 states: {
            hover: {
                color:this.color
            }
        },

因此你可以像这样放一些 hack

  $('#container').highcharts('Map', options);
           var points = $('#container').highcharts().series[0].data;

           for (var i = 0; i < points.length; i++) {


               points[i].pointAttr.hover.fill = points[i].color;

           }

问题解决了...!!!!

Answer 2

您可以像这样禁用它：

states: {
        hover: {
            enabled: false,
        }
    },

Answer 3

这是一个没有 jquery 的解决方案：

const map = new Highcharts.Map(chartOptions);

(function() {
    var points = map.series[0].data;
    for (var i = 0; i < points.length; i++) {
        points[i].pointAttr.hover.fill = points[i].color;
    }
})();

在实例化地图后将其弹出即可。

Answer 4

@Vikas 的解决方案对我不起作用。 pointAttr 不是 'defined'.

设置悬停 color:null 和 brightness:0 对我有用：

states: {
    hover: {
        color: null,  // Set no specific color to use original color
        brightness: 0 // Prevent brightness effect
    }
}

Highmaps hover effect/mouseout 颜色变化

Highmaps hover effect/mouseout color change

highcharts

highmaps