Commit df745474 authored by olau@iola.dk's avatar olau@iola.dk

Add compatibility with Flashcanvas (issue 368) and remove dubious octx.stroke() call

git-svn-id: https://flot.googlecode.com/svn/trunk@278 1e0a6537-2640-0410-bfb7-f154510ff394
parent f20ab627
...@@ -16,20 +16,27 @@ Installation ...@@ -16,20 +16,27 @@ Installation
Just include the Javascript file after you've included jQuery. Just include the Javascript file after you've included jQuery.
Note that you need to get a version of Excanvas (e.g. the one bundled Generally, all browsers that support the HTML5 canvas tag are
with Flot) which is canvas emulation on Internet Explorer. You can supported.
For support for Internet Explorer < 9, you can use Excanvas, a canvas
emulator; this is used in the examples bundled with Flot. You just
include the excanvas script like this: include the excanvas script like this:
<!--[if IE]><script language="javascript" type="text/javascript" src="excanvas.pack.js"></script><![endif]--> <!--[if IE]><script language="javascript" type="text/javascript" src="excanvas.min.js"></script><![endif]-->
If it's not working on your development IE 6.0, check that it has If it's not working on your development IE 6.0, check that it has
support for VML which excanvas is relying on. It appears that some support for VML which Excanvas is relying on. It appears that some
stripped down versions used for test environments on virtual machines stripped down versions used for test environments on virtual machines
lack the VML support. lack the VML support.
Also note that you need at least jQuery 1.2.6 (but at least jQuery You can also try using Flashcanvas (see FlashCanvas.net), which uses
1.3.2 is recommended for interactive charts because of performance Flash to do the emulation. It might be faster with charts with many
improvements in event handling). points. Flot contains some wrapper code for activating Excanvas which
Flashcanvas is compatible with.
You need at least jQuery 1.2.6, but try at least 1.3.2 for interactive
charts because of performance improvements in event handling.
Basic usage Basic usage
......
...@@ -697,15 +697,6 @@ ...@@ -697,15 +697,6 @@
} }
function constructCanvas() { function constructCanvas() {
function makeCanvas(width, height) {
var c = document.createElement('canvas');
c.width = width;
c.height = height;
if (!c.getContext) // excanvas hack
c = window.G_vmlCanvasManager.initElement(c);
return c;
}
canvasWidth = placeholder.width(); canvasWidth = placeholder.width();
canvasHeight = placeholder.height(); canvasHeight = placeholder.height();
placeholder.html(""); // clear placeholder placeholder.html(""); // clear placeholder
...@@ -715,17 +706,32 @@ ...@@ -715,17 +706,32 @@
if (canvasWidth <= 0 || canvasHeight <= 0) if (canvasWidth <= 0 || canvasHeight <= 0)
throw "Invalid dimensions for plot, width = " + canvasWidth + ", height = " + canvasHeight; throw "Invalid dimensions for plot, width = " + canvasWidth + ", height = " + canvasHeight;
if (window.G_vmlCanvasManager) // excanvas hack if (window.G_vmlCanvasManager) // excanvas hack, make sure everything is setup
window.G_vmlCanvasManager.init_(document); // make sure everything is setup window.G_vmlCanvasManager.init_(document);
function makeCanvas(skipPositioning) {
var c = document.createElement('canvas');
c.width = canvasWidth;
c.height = canvasHeight;
if (!skipPositioning)
$(c).css({ position: 'absolute', left: 0, top: 0 });
$(c).appendTo(placeholder);
if (!c.getContext) // excanvas hack
c = window.G_vmlCanvasManager.initElement(c);
return c;
}
// the canvas // the canvas
canvas = $(makeCanvas(canvasWidth, canvasHeight)).appendTo(placeholder).get(0); canvas = makeCanvas(true);
ctx = canvas.getContext("2d"); ctx = canvas.getContext("2d");
// overlay canvas for interactive features // overlay canvas for interactive features
overlay = $(makeCanvas(canvasWidth, canvasHeight)).css({ position: 'absolute', left: 0, top: 0 }).appendTo(placeholder).get(0); overlay = makeCanvas();
octx = overlay.getContext("2d"); octx = overlay.getContext("2d");
octx.stroke();
} }
function bindEvents() { function bindEvents() {
......
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