地图系列的单击事件无法一次单击。 我在点击事件中显示一个弹出窗口,其中包含国家/地区详细信息。它与IE-11以外的其他浏览器兼容。在IE中,单击事件在第一次运行时效果很好,但是在多次单击不同的点后,单击只能双击。
这是我的代码
$(self.element).highcharts('Map', {
chart: {
marginTop: 0,
height: mapheight,
marginTop: marginTop,
marginLeft: 0,
marginBottom: 0,
spacing: 10,
events: {
load: function() {
this.myTooltip = new Highcharts.Tooltip(this, this.options.tooltip);
$(".highcharts-container .highcharts-tooltip:last-child").addClass("highchartClicks");
}
}
}
tooltip: {
enabled: true,
backgroundColor: '#ffffff',
borderWidth: 0,
shadow: true,
padding: 15,
useHTML: true,
formatter: function() {
var flag = this.point.name.trim();
flag = flag.split(" ").join("-");
var tooltipname = this.point.options.name;
var popuptemp = '<span class="tooltipMain">' +
'<span class="tooltiptop">' +
'<div class="header">' +
'<span class="name"><b>' + tooltipname + '</b></span>' +
'</div>' +
'</span>' +
'</span>'
return popuptemp
}
},
plotOptions: {
series: {
stickyTracking: true,
events: {
click: function(e) {
self._loadPopUp(e.point.name, e.point.countryCode);
}
}
}
},
series: [{
data: self.countryList,
allAreas: true,
mapData: Highcharts.maps['custom/africa'],
nullColor: '#fff',
borderColor: '#b3b3b3',
borderWidth: 1,
dataLabels: {
enabled: false,
color: '#FFFFFF',
format: '{point.name}'
},
joinBy: ['hc-a2', 'countryCode'],
name: 'FP2020',
states: {
hover: {
color: '#b3b3b9'
}
}
}]
});