Highcharts Shared Tooltip Between Multi-Series Charts and General Tooltip
I am trying to establish a common hint between charts. It only works well if the prompt is not present shared: true
, if I install shared: true
I get the error:
TypeError: 'undefined' is not an object (evaluating 'a[0].category') highcharts.js:3259
I've prepared an example: http://jsfiddle.net/CAKQH/24408/
If you move your cursor to the first graph it works well, also if you comment shared: true
it works, but if you move your cursor to the second graph you will get an error.
Has anyone encountered this error? Help me solve it please.
source to share
The problem comes from the fact that you have shared: true
in one diagram and it has the default (false) on the other. This is a problem because the method tooltip.refresh
will take different paths and use the input differently based on the chart with a generic value of true or false.
You can find this branching in the source code at line 8806 for the method tooltip.refresh
:
// shared tooltip, array is sent over
if (shared && !(point.series && point.series.noSharedTooltip)) {
....
}
// single point tooltip
else {
....
}
You can handle this by forking inside your method syncTooltip
to handle various cases like this ( JFiddle example ):
function syncTooltip(container, p) {
var i = 0;
for (; i < charts.length; i++) {
if (container.id != charts[i].container.id) {
if(charts[i].tooltip.shared) {
charts[i].tooltip.refresh([charts[i].series[0].data[p]]);
}
else {
charts[i].tooltip.refresh(charts[i].series[0].data[p]);
}
}
}
}
So you can freely set general or true on both charts.
Unfortunately, your plotOptions.series.point.events.mouseOver
-event does not display points that are "selected" via functionality shared: true
, so you will need to find an alternate event to correctly capture this situation.
source to share