avoid passing layout to underlayCallback. Document underlayCallback

diff --git a/docs/index.html b/docs/index.html
index 811b7b7..adc7c15 100644 (file)
--- a/docs/index.html
+++ b/docs/index.html
@@ -870,6 +870,20 @@ perl -ne 'BEGIN{print "Month,Nominal,Real\n"} chomp; ($m,$cpi,$low,$close,$high)
         </tr>
 
         <tr>
+          <td><strong>underlayCallback</strong></td>
+          <td><code>function(canvas, area, dygraph)</code></td>
+          <td><code>null</code></td>
+          <td>When set, this callback gets called before the chart is drawn. It
+            allows you to draw underneath the chart. See the tests for more
+            details on how to use this.
+            <div class="tests">Tests:
+              <a href="tests/underlay-callback.html">underlay-callback</a>
+              <a href="tests/highlighted-region.html">highlighted-region</a>
+            </div>
+          </td>
+        </tr>
+
+        <tr>
           <td><strong>strokeWidth</strong></td>
           <td><code>0.5, 2.0</code></td>
           <td><code>1.0</code></td>

diff --git a/dygraph-canvas.js b/dygraph-canvas.js
index 29341e1..23e93a8 100644 (file)
--- a/dygraph-canvas.js
+++ b/dygraph-canvas.js
@@ -393,7 +393,7 @@ DygraphCanvasRenderer.prototype.render = function() {
   function halfDown(y){return Math.round(y)-0.5};
 
   if (this.options.underlayCallback) {
-    this.options.underlayCallback(ctx, this.area, this.layout, this.dygraph_);
+    this.options.underlayCallback(ctx, this.area, this.dygraph_);
   }
 
   if (this.options.drawYGrid) {

diff --git a/tests/highlighted-region.html b/tests/highlighted-region.html
index 33d92e7..7852753 100644 (file)
--- a/tests/highlighted-region.html
+++ b/tests/highlighted-region.html
@@ -37,7 +37,7 @@
           data,
           {
             labels: ['X', 'Est.', 'Actual'],
-            underlayCallback: function(canvas, area, layout, g) {
+            underlayCallback: function(canvas, area, g) {
               var bottom_left = g.toDomCoords(highlight_start, -20);
               var top_right = g.toDomCoords(highlight_end, +20);
 

diff --git a/tests/underlay-callback.html b/tests/underlay-callback.html
index 5c47582..075f893 100644 (file)
--- a/tests/underlay-callback.html
+++ b/tests/underlay-callback.html
@@ -26,8 +26,9 @@
               showRoller: true,
               errorBars: true,
 
-              underlayCallback: function(canvas, area, layout) {
-                var splitHeight = area.h * (layout.yscale * (2.25 - layout.minyval));
+              underlayCallback: function(canvas, area, g) {
+                var splitHeight = g.toDomCoords(null, 2.25)[1];
+
                 canvas.fillStyle = 'pink';
                 canvas.fillRect(area.x, area.y + area.h, area.w, -splitHeight);
                 canvas.fillStyle = 'lightblue';