Thursday, December 8, 2011

FusionCharts (v3.2.2) javascript bug in IE 8

A customer I’m working with requires data generated charts on their EPiServer website, and for that purpose I’ve implemented FusionCharts. By default FusionCharts render Flash charts with a javascript fallback, or you can simply choose to always render javascript charts if you’re not a fan of Flash.

The FusionCharts documentation is one of the best documentations I’ve ever seen, a pleasure to read, and the installation takes two minutes. Seems like a blast doesn’t it!

I thought so until the front-end developer for the project I’m working on came over to my desk and informed me that the charts did not render in IE 8. They worked fine in IE 7 and IE 9, but not IE 8. Say what? I checked it out and saw that FusionCharts.js gave me a “Invalid argument” error on line 76. Since Google is my friend, I googled the problem and found A LOT of other developers on the FusionCharts forum running into the same problem, but the only answer from FusionCharts was that their developers were working on it. They’ve been working on it for over a month and could not say when the bug would be fixed.

The project is going live in about two weeks, so I don’t have time to wait for other developers to fix their bugs. I tried downgrading to the previous version of FusionCharts, but that caused me some other problems, so I went back to v3.2.2. I googled some more and found a FusionCharts service release that was newer than the version I am using, but the javascript error seemed to be living happily ever after.

So what solved my problems?

I have several charts on one page, and therefore each chart needs its separate ID. Being a developer, I set the ID to be a number (big mistake). Apparently the ID can contain numbers, but it cannot begin with a number, so ID=Chart1 is fine, but ID=1Chart will give you a javascript error in IE 8.

Hopefully they’ll fix this in the next version, or at least add a note of it in their (almost) perfect documentation.