Tooltip doesn't seems to work when parent div position is relative.

[peachananr]

If I wrap the canvas with relative positioned div, the tooltip no longer show up. When I remove position:relative, the tooltip works again. Can you replicate this as well?

Thanks

[peachananr]

I've found a solution that might help you solve this.

I replaced:

context.canvas.onmousemove = function(e) {
 if(chart.tooltips.length > 0) {
 chart.savedState = chart.savedState == null ? context.getImageData(0,0,context.canvas.width,context.canvas.height) : chart.savedState;
 var rendered = 0;
 for(var i in chart.tooltips) {
 var mx = e.x-context.canvas.offsetLeft,
 my = e.y-context.canvas.offsetTop;
 if(chart.tooltips[i].inRange(mx,my)) {
 chart.tooltips[i].render(mx,my);
 rendered++;
 }
 }
 if(rendered == 0) {
 context.putImageData(chart.savedState,0,0);
 }
 }
 }

with this

function getPosition(e) {
 var xPosition = 0;
 var yPosition = 0;

 while(e) {
 xPosition += (e.offsetLeft - e.scrollLeft + e.clientLeft);
 yPosition += (e.offsetTop - e.scrollTop + e.clientTop);
 e = e.offsetParent;
 }
 return { x: xPosition, y: yPosition };
 }

 context.canvas.onmousemove = function(e) {
 if(chart.tooltips.length > 0) {
 chart.savedState = chart.savedState == null ? context.getImageData(0,0,context.canvas.width,context.canvas.height) : chart.savedState;
 var rendered = 0;
 for(var i in chart.tooltips) {
 var position = getPosition(context.canvas),
 mx = e.x - position.x,
 my = e.y - position.y;
 if(chart.tooltips[i].inRange(mx,my)) {
 chart.tooltips[i].render(mx,my);
 rendered++;
 }
 }
 if(rendered == 0) {
 context.putImageData(chart.savedState,0,0);
 }
 }
 }