From 78630ef977d58c77292e18881911b9bd70008f0d Mon Sep 17 00:00:00 2001
From: "olau@iola.dk" <olau@iola.dk@1e0a6537-2640-0410-bfb7-f154510ff394>
Date: Thu, 6 Aug 2009 17:10:08 +0000
Subject: [PATCH] Patches from Paul Kienzle, fix pixel anchoring, add alpha
 support

git-svn-id: https://flot.googlecode.com/svn/trunk@198 1e0a6537-2640-0410-bfb7-f154510ff394
---
 jquery.flot.image.js | 31 ++++++++++++++++++++-----------
 1 file changed, 20 insertions(+), 11 deletions(-)

diff --git a/jquery.flot.image.js b/jquery.flot.image.js
index 9ca92b6..90babf6 100644
--- a/jquery.flot.image.js
+++ b/jquery.flot.image.js
@@ -28,6 +28,7 @@ Options for the plugin are
       images: {
           show: boolean
           anchor: "corner" or "center"
+          alpha: [0,1]
       }
   }
 
@@ -39,8 +40,8 @@ Note that because the data format is different from usual data points,
 you can't use images with anything else in a specific data series.
 
 Setting "anchor" to "center" causes the pixels in the image to be
-anchored at the pixel centers inside of at the corners, effectively
-letting half a pixel stick out as border.
+anchored at the corner pixel centers inside of at the pixel corners,
+effectively letting half a pixel stick out to each side in the plot.
 
 
 A possible future direction could be support for tiling for large
@@ -53,6 +54,7 @@ images (like Google Maps).
         series: {
             images: {
                 show: false,
+                alpha: 1,
                 anchor: "corner" // or "center"
             }
         }
@@ -140,7 +142,18 @@ images (like Google Maps).
                     y2 = y1;
                     y1 = tmp;
                 }
-
+                
+                // if the anchor is at the center of the pixel, expand the 
+                // image by 1/2 pixel in each direction
+                if (series.images.anchor == "center") {
+                    tmp = 0.5 * (x2-x1) / (img.width - 1);
+                    x1 -= tmp;
+                    x2 += tmp;
+                    tmp = 0.5 * (y2-y1) / (img.height - 1);
+                    y1 -= tmp;
+                    y2 += tmp;
+                }
+                
                 // clip
                 if (x1 == x2 || y1 == y2 ||
                     x1 >= xaxis.max || x2 <= xaxis.min ||
@@ -148,13 +161,6 @@ images (like Google Maps).
                     continue;
 
                 var sx1 = 0, sy1 = 0, sx2 = img.width, sy2 = img.height;
-                if (series.images.anchor == "center") {
-                    sx1 += 0.5;
-                    sy1 += 0.5;
-                    sx2 -= 0.5;
-                    sy2 -= 0.5;
-                }
-
                 if (x1 < xaxis.min) {
                     sx1 += (sx2 - sx1) * (xaxis.min - x1) / (x2 - x1);
                     x1 = xaxis.min;
@@ -192,10 +198,13 @@ images (like Google Maps).
                     y1 = tmp;
                 }
 
+                tmp = ctx.globalAlpha;
+                ctx.globalAlpha *= series.images.alpha;
                 ctx.drawImage(img,
                               sx1, sy1, sx2 - sx1, sy2 - sy1,
                               x1 + plotOffset.left, y1 + plotOffset.top,
                               x2 - x1, y2 - y1);
+                ctx.globalAlpha = tmp;
             }
         });
     }
@@ -223,6 +232,6 @@ images (like Google Maps).
         init: init,
         options: options,
         name: 'image',
-        version: '1.0'
+        version: '1.1'
     });
 })(jQuery);