Internet Explorer 9 Beta not working

73 views
Skip to first unread message

jensa

unread,
Sep 16, 2010, 4:40:54 PM9/16/10
to Flot graphs
Hi,

It seems that flot is not working at all in Internet Explorer 9 Beta.
I am using flot in an application, so this is not working either
(ofcourse).

This example is just one of the examples that are not working:
http://people.iola.dk/olau/flot/examples/turning-series.html

Microsoft have implemented a completely new Javascript engine in IE9
called Chakra, maybe something is not completely compliant in either
the engine or in flot.

Best regards
Jens

Lone Shepherd

unread,
Sep 17, 2010, 9:58:53 PM9/17/10
to Flot graphs
I see this problem, as well.

Lone Shepherd

unread,
Sep 18, 2010, 10:04:56 AM9/18/10
to Flot graphs
Actually it seems the problem on the flot website is poor feature
detection.

If you do not include the excanvas js stuff, flot works fine in IE9.


On Sep 16, 4:40 pm, jensa <jensa.hyld...@gmail.com> wrote:

jensa

unread,
Sep 19, 2010, 11:30:56 AM9/19/10
to Flot graphs
Hi Lone

Could you please elaborate that?

Thank you.
> > Jens- Skjul tekst i anførselstegn -
>
> - Vis tekst i anførselstegn -

George Roberts

unread,
Sep 19, 2010, 12:09:26 PM9/19/10
to flot-...@googlegroups.com
>> If you do not include the excanvas js stuff, flot works fine in IE9.
> Could you please elaborate that?

flot uses the <canvas> tag which is a new HTML5 feature. HTML5 isn't fully
described yet (I believe) - certainly Firefox implemented <canvas> long
before HTML5 has turned into a standard. I believe ie is the only major
modern browser that doesn't support canvas but it does support it's own
graphics standard with similar features. So some wonderful person created
excanvas.js which emulates all of the <canvas> commands for ie. So when
people use flot they usually include a little piece of non-standard html
that checks what version the browser is and if it is IE then it includes
excanvas.js. But now ie9 implements <canvas> just fine so that little line
of javascript needs to get slightly more complicated so that excanvas is
only included for ie8 and lower.

Since ie9 is still in beta there is yet time for everyone to update all
their web pages that use flot.

Here is the line of code in question that should be in any web page that
uses flot:

<!--[if IE]><script language="javascript" type="text/javascript"
src="../excanvas.min.js"></script><![endif]-->

One can detect the browser in javascript like this:
var agt=navigator.userAgent.toLowerCase();
if (agt.indexOf("msie") != -1) alert( 'Internet Explorer');

But you can't normally conditionally include a js file. So an alternate fix
is for excanvas.js to detect the browser type and see if it is ie9. I
suspect the latest version of excanvas already does this so if you use the
bleeding edge version of excanvas your ie9 problems will probably go away.
The alternative is to use more advanced conditional comments:

warning untested code written by someone who has never used "conditional
comments":
<!--[if IE]><!--[if IE lte 8]><script language="javascript"
type="text/javascript"
src="../excanvas.min.js"></script><![endif]--><![endif]-->

More on conditional comments which seems to be a feature that only works in
IE (which is fine for our purposes):
http://www.javascriptkit.com/howto/cc2.shtml

- George Roberts
http://gr5.org

Stefano Perfili

unread,
Sep 19, 2010, 6:10:39 PM9/19/10
to flot-...@googlegroups.com
Following on from George Roberts, if you change the excanvas line to the following, it should work fine (in theory...)

<!--[if lt IE 9]><script language="javascript" type="text/javascript" src="excanvas.min.js"></script><![endif]-->

I'll be testing my site in IE9 soon so time will tell!

-Stef

Lone Shepherd

unread,
Sep 19, 2010, 7:37:30 PM9/19/10
to Flot graphs
Probably a better way is to use feature detection. You can certainly
conditionally include javascript -- try the following code:

<script type="text/javascript">
if(!document.createElement('canvas').getContext) {
document.write('<script src="excanvas.min.js" type="text/
javascript"></scr' + 'ipt>');
}
</script>


Although, whether or not it's appropriate to include the excanvas
stuff for non-IE browsers that do not support canvas, I don't know.

With the above code, my flot pages work fine in Chrome, FF 3.6, FF 4
beta, IE9 beta, and IE8.

jensa

unread,
Sep 20, 2010, 4:09:18 AM9/20/10
to Flot graphs
> With the above code, my flot pages work fine in Chrome, FF 3.6, FF 4
> beta, IE9 beta, and IE8.

Thanks a lot for all the good comments, now i understand the problem
clearly.

However, i cannot get it to work here. For testing purposes i have
completely removed the reference to excanvas in the basic example,
just to make sure that it will work in IE 9, without any troubles with
non-working feature detection.

Browser: IE 9.0.7930.16406
Flot version: 0.6
Url: http://www.overfussing.dk/flot/examples/basic.html (only change
from original is that i have removed the line with excanvas
completely)
OS: Windows 7 Starter

Did you do something else to get it to work with your IE9?

Anyone that can see the above page in IE9 correctly? (i know it wont
work in IE <9)

Regards Jens


Colin Law

unread,
Sep 20, 2010, 5:23:32 AM9/20/10
to flot-...@googlegroups.com
On 20 September 2010 09:09, jensa <jensa....@gmail.com> wrote:
>> With the above code, my flot pages work fine in Chrome, FF 3.6, FF 4
>> beta, IE9 beta, and IE8.
>
> Thanks a lot for all the good comments, now i understand the problem
> clearly.
>
> However, i cannot get it to work here. For testing purposes i have
> completely removed the reference to excanvas in the basic example,
> just to make sure that it will work in IE 9, without any troubles with
> non-working feature detection.
>
> Browser: IE 9.0.7930.16406
> Flot version: 0.6
> Url: http://www.overfussing.dk/flot/examples/basic.html (only change
> from original is that i have removed the line with excanvas
> completely)
> OS: Windows 7 Starter

Not necessarily significant but the page contains invalid html, see
http://validator.w3.org/check?uri=http%3A%2F%2Fwww.overfussing.dk%2Fflot%2Fexamples%2Fbasic.html&charset=%28detect+automatically%29&doctype=Inline&group=0

Colin

Lone Shepherd

unread,
Sep 20, 2010, 11:01:41 AM9/20/10
to Flot graphs
I'm at work now, so I can't check this on IE9, but it should work just
fine:

http://loneshepherd.org/flot/graph-types.html

Inside the html head, I am using the feature detection I posted above
to determine whether or not to include the excanvas javascript.


On Sep 20, 4:09 am, jensa <jensa.hyld...@gmail.com> wrote:
> > With the above code, my flot pages work fine in Chrome, FF 3.6, FF 4
> > beta, IE9 beta, and IE8.
>
> Thanks a lot for all the good comments, now i understand the problem
> clearly.
>
> However, i cannot get it to work here. For testing purposes i have
> completely removed the reference to excanvas in the basic example,
> just to make sure that it will work in IE 9, without any troubles with
> non-working feature detection.
>
> Browser: IE 9.0.7930.16406
> Flot version: 0.6
> Url:http://www.overfussing.dk/flot/examples/basic.html(only change

jensa

unread,
Sep 20, 2010, 1:38:57 PM9/20/10
to Flot graphs
> I'm at work now, so I can't check this on IE9, but it should work just
> fine:
>
> http://loneshepherd.org/flot/graph-types.html

Works fine here too in IE 9... checked mine again, still not working.

If i look at your jquery.flot.js file it is very different from mine
(the original from 0.6), however yours is still labeled 0.6, so i
guess you have patched it up a lot.

When i copy your jquery.flot.js file to my directory, everything works
perfectly in IE9 here too... so some changes are necessary in this
file.

I tried to make a compare, but very much is changed.

I would be very glad to know, what makes the difference, the original
0.6 wont do it with your fix alone.

Regards Jens

Lone Shepherd

unread,
Sep 20, 2010, 2:38:30 PM9/20/10
to Flot graphs
Ahhh...I am actually using the dev version of flot available at:

http://flot.googlecode.com/svn/trunk/

Hope that helps ;)
Reply all
Reply to author
Forward
0 new messages