From: Aman Sharma <20aman@gmail.com>
Date: Fri, 15 Apr 2016 04:11:09 +0000 (-0400)
Subject: Using the dynamic absolute position of the canvas, even for relative placement of... 
X-Git-Tag: v2.0.1~4^2
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F2263%2Fhead;p=thirdparty%2FChart.js.git

Using the dynamic absolute position of the canvas, even for relative placement of the chart

This will work with both relative and absolute position for the chart and will apply the tooltips appropriately. I have tested in a normal context and then also using the chart in the second column of two column table i.e. in a different position on the screen. Without this, the default tooltips will appear at the same position no matter where the chart is placed. They will appear misplaced. The fix I have provided allows the tooltips to appear smoothly with the chart, no matter where it is placed on the web page.
---

diff --git a/samples/line-customTooltips.html b/samples/line-customTooltips.html
index 50c106420..6695cb663 100644
--- a/samples/line-customTooltips.html
+++ b/samples/line-customTooltips.html
@@ -90,14 +90,14 @@
         }
       }
 
-      var offset = $(this._chart.canvas).offset();
+      var position = $(this._chart.canvas)[0].getBoundingClientRect();
 
       // Display, position, and set styles for font
       tooltipEl.css({
         opacity: 1,
         width: tooltip.width ? (tooltip.width + 'px') : 'auto',
-        left: offset.left + tooltip.x + 'px',
-        top: offset.top + top + 'px',
+        left: position.left + tooltip.x + 'px',
+        top: position.top + top + 'px',
         fontFamily: tooltip._fontFamily,
         fontSize: tooltip.fontSize,
         fontStyle: tooltip._fontStyle,