当没有可用于悬停国家/地区的数据时,Highmaps中的自定义光标

时间:2016-07-04 12:03:27

标签: javascript css highcharts highmaps

我使用Highcharts和Highmaps来显示国家/地区信息。我的世界地图初始化如下:

data.series[0].data = {...}; // array with 135 entries     
data.series[0].mapData = Highcharts.maps['custom/world']; // world map with 213 countries
data.series[0].point.events.click = function(){ //do something };

一切正常,数据显示,onClick处理程序也正常工作。要向用户显示国家/地区是可点击的,我将光标设置为手形图标:

data.plotOptions.series.cursor = "pointer";

现在问题。有时我不会为所有国家/地区提供数据,因此"空白"国家/地区无法点击。单击国家/地区时,Highmaps不会触发事件,但我也想覆盖这些国家/地区的光标。

如果给定点没有值,我该如何设置自定义光标?

Highcharts v4.2.5

1 个答案:

答案 0 :(得分:1)

您可以使用

plotOptions.series.point.events.mouseOver事件

plotOptions.series.point.events.mouseOut事件。

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

                        $("#container").addClass("cursor");
                    },
                    mouseOut: function () {

                        $("#container").removeClass("cursor");
                    }
                }
            },
         }
}

通过这样做,没有事件触发没有价值的区域。 您还应该删除plotOptions.series.cursor = "pointer";

A Working Sample On Fiddle