読者です 読者をやめる 読者になる 読者になる

google chart APIのGaugeがIE8では表示できない件

google chartのGauge(計器)の表示が、IE8だけ表示できない(IE6,IE9は表示できる)現象に遭遇した。

http://code.google.com/p/google-visualization-api-issues/issues/detail?id=5

でも話題になっているが、どうもIE8だけっていうのはgoogle chart側の問題ではないように思う。

IEにはレンダリングモードがあり、DOCTYPE宣言があればそれぞれのバージョンの標準準拠モード、DOCTYPE宣言がない場合はQuirksモード(いわゆる互換モード)となって表示しているらしい。

ヘッダに、

....
<head>
<meta http-equiv="X-UA-Compatible" content="IE=7" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
....

と書けば、このファイルは"IE7標準準拠モード"となり、

....
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
....

と書けば、このファイルは"IE7標準準拠モードかQuirksモード"となるらしい。

ということで、

<meta http-equiv="X-UA-Compatible" content="IE=7" />

と記述することでIE8でもgoogle chartのGaugeが表示された(なんだかなぁ)。

ちなみに、

<meta http-equiv="X-UA-Compatible" content="IE=5; IE=7; IE=8">

のように、複数を指定した場合は最新の標準準拠モードを用いる(この場合はIE8標準準拠モードになる)とのこと。

なお、IEレンダリングモードに関しては以下を参照した。

http://blog.summerwind.jp/archives/1145/
http://blog.summerwind.jp/archives/1182/
http://tenderfeel.xsrv.jp/memo/487/