CODEWITHSUNDEEP
javascriptjquerycsshighchartstooltip
bragboy
bragboy

Reputation: 35542

Highcharts: How to make Tooltip position to be visible in the Viewport

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 ?

enter image description here

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>

Upvotes: 4

Views: 1546

Answers (1)

Oleksandr T.
Oleksandr T.

Reputation: 77482

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 };
}

Upvotes: 1

Related Questions