javascript - HighMaps 分组悬停

Question

目标：在下面的演示中，如果你将鼠标悬停在右上角的状态上，你会看到它们都被命名为“Intermountain”。我需要它们都在悬停时突出显示，文档并没有真正提供有关如何执行此操作的详细信息。

我尝试使用

             states: {
                    hover: {
                        enabled: true
                    }
                },

但它不能满足我的需要。

演示：http: //jsfiddle.net/TUy7x/781/

$(function () {

    // Initiate the chart
    $('#container').highcharts('Map', {

        series: [{
            "type": "map",

            states: {
                hover: {
                    enabled: true
                }
            },
                "data": //more than highchart character limits
    });
});

Answer 1

您可以捕获 mouseOver / mouseOut 然后找到所有具有相同名称的点。

series:{
            point:{
                events:{
                    mouseOver:function(){

                        var series = this.series,
                            name = this.name;

                        $.each(series.data, function(i, data){
                            if(data.name === name) {
                                data.setState('hover');
                            }
                        });
                    },
                    mouseOut:function(){
                        var series = this.series,
                            name = this.name;

                        $.each(series.data, function(i, data){
                            if(data.name === name) {
                                data.setState('');
                            }
                        });
                    }
                }
            }
        }

示例：http: //jsfiddle.net/TUy7x/782/