1. 概述
1.1 問題描述
将一張含有圖表的報表通過 iframe 的方式嵌入到 HTML 中,圖表在 IE9 的 quirks 模式下顯示不出來,其他浏覽器比如說:FireFox,Google 等浏覽器下顯示正常,如下圖:
IE9 的雜項(quirks)模式下:
其他浏覽器下:
1.2 實現思路
由於 IE9 下面不同解析模式,圖表展現不同,IE9 下的雜項(quirks)模式不可以,ie9标準模式能正常展現,所以我們可以修改外層的 HTML 的說明來解決這個問題,指明默認采用 IE9 模式即可。
2. 示例
将報表嵌入到 HTML 中的代碼如下:詳見 Web 頁面簡單集成例子。
完整代碼如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<body>
<iframe id="total" width="800px" height="800px" src="/webroot/decision/view/report?viewlet=/doc/Primary/Chart/Chart.cpt" ></iframe>
</body>
</html>
2.1 方案一
修改 doctype,在最上方的 doctype 說明中聲明該 HTML 在 IE9 下打開的時候,打開模式默認爲 IE 标準模式,代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
完整代碼如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<body>
<iframe id="total" width="800px" height="800px" src="/webroot/decision/view/report?viewlet=/doc/Primary/Chart/Chart.cpt" ></iframe>
</body>
</html>
2.2 方案二
增加一個 meta 标簽,表明 IE 浏覽器打開該 HTML 時,采用 IE 标準模式,代碼如下:
<meta http-equiv="X-UA-Compatible" content="IE=9">
完整代碼如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<meta http-equiv="X-UA-Compatible" content="IE=9">
<html>
<body>
<iframe id="total" width="800px" height="800px" src="/webroot/decision/view/report?viewlet=/doc/Primary/Chart/Chart.cpt" ></iframe>
</body>
</html>
2.3 預覽效果
修改将修改之後的 HTML 放在%FineReport_HOME%\webapps\webroot目錄下,在 IE9 地址欄輸入http://ip:端口号/webroot/xxx.html,能可以看到圖表已經顯示出來,就說明上面的修改成功。如下圖: