Commit 78630ef9 authored by olau@iola.dk's avatar olau@iola.dk

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
parent 3360d274
...@@ -28,6 +28,7 @@ Options for the plugin are ...@@ -28,6 +28,7 @@ Options for the plugin are
images: { images: {
show: boolean show: boolean
anchor: "corner" or "center" anchor: "corner" or "center"
alpha: [0,1]
} }
} }
...@@ -39,8 +40,8 @@ Note that because the data format is different from usual data points, ...@@ -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. 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 Setting "anchor" to "center" causes the pixels in the image to be
anchored at the pixel centers inside of at the corners, effectively anchored at the corner pixel centers inside of at the pixel corners,
letting half a pixel stick out as border. effectively letting half a pixel stick out to each side in the plot.
A possible future direction could be support for tiling for large A possible future direction could be support for tiling for large
...@@ -53,6 +54,7 @@ images (like Google Maps). ...@@ -53,6 +54,7 @@ images (like Google Maps).
series: { series: {
images: { images: {
show: false, show: false,
alpha: 1,
anchor: "corner" // or "center" anchor: "corner" // or "center"
} }
} }
...@@ -140,7 +142,18 @@ images (like Google Maps). ...@@ -140,7 +142,18 @@ images (like Google Maps).
y2 = y1; y2 = y1;
y1 = tmp; 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 // clip
if (x1 == x2 || y1 == y2 || if (x1 == x2 || y1 == y2 ||
x1 >= xaxis.max || x2 <= xaxis.min || x1 >= xaxis.max || x2 <= xaxis.min ||
...@@ -148,13 +161,6 @@ images (like Google Maps). ...@@ -148,13 +161,6 @@ images (like Google Maps).
continue; continue;
var sx1 = 0, sy1 = 0, sx2 = img.width, sy2 = img.height; 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) { if (x1 < xaxis.min) {
sx1 += (sx2 - sx1) * (xaxis.min - x1) / (x2 - x1); sx1 += (sx2 - sx1) * (xaxis.min - x1) / (x2 - x1);
x1 = xaxis.min; x1 = xaxis.min;
...@@ -192,10 +198,13 @@ images (like Google Maps). ...@@ -192,10 +198,13 @@ images (like Google Maps).
y1 = tmp; y1 = tmp;
} }
tmp = ctx.globalAlpha;
ctx.globalAlpha *= series.images.alpha;
ctx.drawImage(img, ctx.drawImage(img,
sx1, sy1, sx2 - sx1, sy2 - sy1, sx1, sy1, sx2 - sx1, sy2 - sy1,
x1 + plotOffset.left, y1 + plotOffset.top, x1 + plotOffset.left, y1 + plotOffset.top,
x2 - x1, y2 - y1); x2 - x1, y2 - y1);
ctx.globalAlpha = tmp;
} }
}); });
} }
...@@ -223,6 +232,6 @@ images (like Google Maps). ...@@ -223,6 +232,6 @@ images (like Google Maps).
init: init, init: init,
options: options, options: options,
name: 'image', name: 'image',
version: '1.0' version: '1.1'
}); });
})(jQuery); })(jQuery);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment