Either of the html5-respond.js or html5.js JS files cause Flot graphs to render blank, since they break Flot's access to the <canvas> element. These files are loaded when either of the following options (or both) are checked on the theme settings page:

  • Add Respond.js JavaScript to add basic CSS3 media query support to IE 6-8.
  • Add HTML5 shim JavaScript to add support to IE 6-8.

If I turn off those two options (both) for my Zen subtheme, Flot graphs render perfectly in IE8. There was a solution (though probably not ideal) posted to Stack Overflow here: Using Flot with Bootstrap: IE8 compatibility?. It looks like the idea is that you can shiv everything except the canvas element...

Is there any better solution? If not, what would be the recommended way for me to get the shiv, responsiveness, and Flot all working harmoniously in IE 8?

#2 html5shiv-update_1812836-2.patch13.17 KBgeerlingguy
Members fund testing for the Drupal project. Drupal Association Learn more


geerlingguy’s picture

I found that it may be an issue of using an older version of html5shiv. Please see: https://github.com/aFarkas/html5shiv/issues/55

I'm going to try manually replacing Zen's shiv, then I'll try writing up a patch.

geerlingguy’s picture

Status: Active » Needs review
13.17 KB

Attached patch updates included html5shiv code in html5.js and html5-respond.js to the latest version, from pre3.5 to 3.6.2pre. This fixes the issue with access to the <canvas> element by other libraries (like excanvas, which Flot uses).

JohnAlbin’s picture

Status: Needs review » Fixed

I've updated Zen to HTML5shiv 3.6.2 and respond 1.2.0. Thanks!

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.