Search code examples
jqueryflot

jQuery plugin Flot crushes web site


Using Flot to show some graphs. Out of the blue, the website started to crush.
The problem is at this line in jquery.flot.js:

if (!c.getContext) // excanvas hack
    c = window.G_vmlCanvasManager.initElement(c);

The exception: G_vmlCanvasManager is undefined.

Working well with Firefox 12 with the real web server.
Working well with Firefox 12 with Visual Studio 2010 (local server).
Working well when using IE 9 with the real web server.
Crushes when using IE 9 with Visual Studio 2010 (local server).
There is no IIS installed at the dev computer.

Re-installing VS and clearing its cache didn't help.
Downloading fresh version of Flot didn't help.
Disabling the authorization mechanism didn't help.

Any advice will be welcome.


Solution

  • That error indicates that the browser doesn't support HTML5 canvas, and you aren't using the Excanvas plugin to emulate it.

    My guess is that the problem lies in your page not using the correct DOCTYPE:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    

    When the DOCTYPE is missing or incorrect, IE9 renders the page in quirks mode, which does not support HTML5 canvas. You're then either not including excanvas.js, or you have it wrapped in an [if lte IE 8] conditional, which does not trigger, since the browser is IE9.

    It's likely that your real web server automatically adds a DOCTYPE, while Visual Studio's doesn't. If that's the case, then you need to either add it yourself, or cause the VS server to output one.