Highcharts：如何使工具提示位置在视口中可见

Question

I am using a chart that is vertically longer that is wrapped inside a Container with Veritical scrolling enabled. Everything works fine. However, when I create a tooltip (in my case a big one), it gets hidden at times because it thinks the view port of chart is big. Is there any way to make the tooltip in a fixed position or always appear in the parent container's viewport ?

A sample fiddle having the similar problem: http://jsfiddle.net/Swsbb/52/

<div style='max-height:300px;overflow-y:auto'>
   <div id="container" style="height: 1000px"></div>
</div>

Answer 1

In tooltip there is option useHTML , that adds advanced formatting to tooltip, also there is option positioner - this is callback function that allows you change position for tooltip.

// fixed position
positioner: function () {
  return { x: 10, y: 10 };
},

// change position only for y
positioner: function (labelWidth, labelHeight, point) {
  return { x: point.plotX, y: point.plotY - 50 };
}

• http://www.highcharts.com/maps/demo/tooltip

• http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/highcharts/tooltip/positioner/

• http://jsfiddle.net/Swsbb/