问题
Sometimes it is very difficult to get the Highcharts Javascript charting library to show a tool tip for certain data points. For example, try to show the tooltip of the data point at 50,50 on the below link. It is very difficult to get it to show, and it flickers a lot. Does anyone know about some workaround?
http://highcharts.com/jsbin/ogixaz/2/edit
I tried it with an update-to-date Chrome and Firefox.
回答1:
have you tried:
//...
plotOptions:{
series:{
stickyTracking:true;
}
}
UPDATE:
I have to say that i looked at your embeded example and understood exactly what you meant,
but after moveing your code into the jsFiddle and setting the property shared:true
(in the tooltip object), it works fine. check it... http://jsfiddle.net/yoav_barnea/LFvVy/2/
the important part is the property shared:true
:
tooltip: {
formatter: function() {
return '<b style="font-size:18px;font-weight:bold;">Some very long title</b><br/>' + this.x + ":" + this.y + " <br/>and some<br/> extra stuff<br/>line<br/>line";
},
useHTML: true,
shared:true
},
UPDATE 2:
as for your other problem on getting the costom c
property (that you mentioned in the comment...), the solution for that is to fix your code inside the formatter function into somthing like this: return ... this.points[0].point.c
(again, this was a new issue, not related to the first one of flickering tooltip...)
回答2:
The reason the tooltip at 50,50 flickers is because the tooltip is being drawn over the point. The points to the left and right allow room for the tooltip to be drawn to the side. The reason the middle one can't be drawn to the side is that the chart is small, and the toolip is big.
Some ideas to help this situation: 1. Making the tooltip smaller. 2. Make the chart bigger (try making the right hand side bigger in your example). 3. Use the highcharts tooltip.positioner function to place the tooltip somewhere else.
来源:https://stackoverflow.com/questions/15247201/highcharts-tooltips-not-accessible-for-certain-data-points