延长链接地图上的工具提示持续时间
Extend ToolTip Duration On Linked Map
我正在使用最新的 Highmaps 并尝试创建一个包含 2 个(或更多)地图的页面。渲染地图很好。问题是当我试图 link 所有地图中的工具提示时。我已经建立了一个基本的例子here。我的问题是非主地图的工具提示会在一段时间后淡出 (tooltip.hideDelay
)。我不想增加 hideDelay
,因为它还需要应用于所有图表(这将导致工具提示在用户悬停在 "primary" 地图上的时间过长)。
如何使任何辅助地图上的工具提示保持可见,直到用户在他们正在与之交互的地图上 mouseOut
时显示?
我的 link 工具提示代码如下:
plotOptions: {
series: {
point: {
events: {
mouseOver: function () {
//get this map's selected shape:
var selGeoID = this.properties.code_hasc;
//set up other chart's pointers:
var otherChart = $('#container2').highcharts();
var otherData = (otherChart.series[0].data);
//find this map's shape ID in the other chart's shapes:
var arrayData = $.grep(otherData, function (e) {
return e.code_hasc == selGeoID;
});
//if we have a match then loop through all points in
//other map to set tooltip on/off:
if (arrayData.length == 1) {
newIndex = arrayData[0].index;
otherData.forEach(function (arrayItem) {
if (arrayItem.index != newIndex) {
arrayItem.setState();
otherChart.tooltip.hide();
} else {
otherData[newIndex].setState('hover');
otherChart.tooltip.refresh(otherData[newIndex]);
}
});
}
},
//clear tooltips on other chart:
mouseOut: function () {
var otherChart = $('#container2').highcharts();
var otherData = (otherChart.series[0].data);
otherData.forEach(function (arrayItem) {
arrayItem.setState();
otherChart.tooltip.hide();
});
}
}
}
}
},
为了防止隐藏第二个图表中的工具提示,请不要在 JSFiddle 中的 JS 代码的第 86 行调用 tooltip.hide()
。
已修复 fiddle:http://jsfiddle.net/1fq9jh0e/
我正在使用最新的 Highmaps 并尝试创建一个包含 2 个(或更多)地图的页面。渲染地图很好。问题是当我试图 link 所有地图中的工具提示时。我已经建立了一个基本的例子here。我的问题是非主地图的工具提示会在一段时间后淡出 (tooltip.hideDelay
)。我不想增加 hideDelay
,因为它还需要应用于所有图表(这将导致工具提示在用户悬停在 "primary" 地图上的时间过长)。
如何使任何辅助地图上的工具提示保持可见,直到用户在他们正在与之交互的地图上 mouseOut
时显示?
我的 link 工具提示代码如下:
plotOptions: {
series: {
point: {
events: {
mouseOver: function () {
//get this map's selected shape:
var selGeoID = this.properties.code_hasc;
//set up other chart's pointers:
var otherChart = $('#container2').highcharts();
var otherData = (otherChart.series[0].data);
//find this map's shape ID in the other chart's shapes:
var arrayData = $.grep(otherData, function (e) {
return e.code_hasc == selGeoID;
});
//if we have a match then loop through all points in
//other map to set tooltip on/off:
if (arrayData.length == 1) {
newIndex = arrayData[0].index;
otherData.forEach(function (arrayItem) {
if (arrayItem.index != newIndex) {
arrayItem.setState();
otherChart.tooltip.hide();
} else {
otherData[newIndex].setState('hover');
otherChart.tooltip.refresh(otherData[newIndex]);
}
});
}
},
//clear tooltips on other chart:
mouseOut: function () {
var otherChart = $('#container2').highcharts();
var otherData = (otherChart.series[0].data);
otherData.forEach(function (arrayItem) {
arrayItem.setState();
otherChart.tooltip.hide();
});
}
}
}
}
},
为了防止隐藏第二个图表中的工具提示,请不要在 JSFiddle 中的 JS 代码的第 86 行调用 tooltip.hide()
。
已修复 fiddle:http://jsfiddle.net/1fq9jh0e/