Not working Properly when loaded inside a hidden div

[GowrishKumar]

Hi
i'm using Highcharts with Twitter bootstrap and i've a tab control which has few tabs.i'm loading highchart in one of a tab which is initially hidden.when user clicks a tab then only that particular tab content become visible.After become visible i try to add annotation by clicking somewhere in the chart but annotation not adding in clicked position.it's adding in wrong position.

JSFiddle :http://jsfiddle.net/8xsWu/2/
i can't able make it work on JSFiddle.but the problem is Initially the graph in hidden div,when it become active (visible ) annotation not adding in correct clicked position

Any Help?

Regards,
Gowrish

[pawelfus]

Looks like offset for Highcharts container isn's updated after loading into tabs. I have fixed your demo to make it work: http://jsfiddle.net/8xsWu/6/

If you want to use it inside hidden container with bootstrap tabs, then change all:

 e.pageX - container.offsetLeft
 e.pageY - container.offsetTop

to:

e.pageX - offset.left
e.pageY - offset.top

Where offset is variable taken from jQuery's offset() method:

  var offset = $(container).offset();

[GowrishKumar]

Thank You :) Works like a charm