highcharts - Redrawing the tooltip inside of the tooltip positioner callback -
i'm using i'm using tooltip formatter function control of tooltip, including adding custom css create arrow on side of tooltip box facing mouse. using positioner callback not determine placement of tooltip, when changes 1 side of mouse other i'm updating formatter callback switch side of tooltip arrow lies on (see code below). works fine, except first point causes tooltip switch sides of mouse. clear tooltip's "formatter" function called before tooltips "positioner" function ( reasons obvious ). however, prevents me correctly drawing tooltip when changes sides. need able in positioner callback update formatter function, , redraw tooltip. possible?
positioner: function (boxwidth, boxheight, point) { // set variables var chart = this.chart; var plotleft = chart.plotleft; var plottop = chart.plottop; var plotwidth = chart.plotwidth; var plotheight = chart.plotheight; var distance = 40; var pointx = point.plotx; var pointy = point.ploty; // determine if need flip tooltip following on left // following on right if ((pointx - boxwidth - distance) < plotleft) { x = pointx + distance; chart.tooltip.options.formatter = function () { // upate tooltip formatter here }; } }
here js fiddle example of issue http://jsfiddle.net/btews/
if go slowly, , notice first point switch happens arrow point wrong direction. after corrects ( described in post ). looking solution correct behavior in case.
you can have enabled both classes tooltip, , remove inproper in positioner, see: http://jsfiddle.net/btews/3/
default formatter:
formatter: function () { var s = '<div id="custom-tooltip" class="tooltip-left tooltip-right">'; var chart = null; s += "<div style='padding:5px;color:white'>some tooltip</div></div>"; return s; },
and removing:
if ((pointx - boxwidth - distance) < plotleft) { x = pointx + 60; $("#custom-tooltip").removeclass('tooltip-right'); } else { x = math.max(plotleft, pointx - boxwidth - 10); $("#custom-tooltip").removeclass('tooltip-left'); }
Comments
Post a Comment