IE9 embedded pie chart as an iframe doesn't work

[Isidoros]

I am facing the following issue with IE9 while in Firefox and Chrome
everything works smoothly.

While the pie chart html page alone works perfectly while I am
embedding it in another we page as an iframe I am getting the
following error

SCRIPT5022: Every row given must be either null or an array.
format+el,default,corechart.I.js, line 206 character 63

Because IE drives me crazy any help will be appreciated

[asgallant]

Can you post a link to the page or post your code?

[tee4cute]

I successfully draw pie chart in IFRAME on IE7+, FF, Chrome, and safari.

For my case, it is neccessary to draw the chart in inner frame because there is a conflict between google chart API & ICEFaces framework 1.8. (I've found that the script which is conflict is "icefaces-d2d.js")

Hence, I use an IFRAME with google chart inside and style it with no border to let the user see as on the same page. I don't want browser to send the request to IFRAME's src attribute path. So, I totally use DOM implementation to draw google chart in IFRAME in completely AJAX style. (You have do some techniques to let it runs fine on IE because IE8- will never create "document" DOM element for IFRAME content if the IFRAME's src attribute is not specified.

(I think you have to extract my code because I also implement chart auto-resizing feature if the container is resized too. It quite dirty >.<)

The code ....

<div id="chart_div"></div>
<script type="text/javascript">var resizeTimer;var oldWidth;var oldHeight;var iframeEl;var iframeChartDiv;var iframeDocument;var iframeDocumentHead;var chartScriptDom;function createIframe() {var divDom = document.getElementById('chart_div');var oldIframe = document.getElementById('chart_iframe');if(oldIframe) {divDom.removeChild(oldIframe);}var iframe = document.createElement('iframe');iframe.setAttribute('id', 'chart_iframe');iframe.setAttribute('frameBorder', '0');iframe.setAttribute('name', 'chart_iframe');iframe.style.width = '100%';iframe.style.height = '100%';iframe.style.border = 0;iframe.style.margin = 0;iframe.style.padding = 0;iframe.onload = onFrameLoad;divDom.appendChild(iframe);try {var iframeWindow = iframe.contentWindow || iframe.contentDocument.parentWindow;iframeWindow.onload = onFrameLoad;} catch(e) {}iframeEl = iframe;}function onFrameLoad() {var iframe = this;if(!iframe.id) {iframe = document.getElementById('chart_iframe');}var contentDocument = iframe.contentDocument;if(!contentDocument) {contentDocument = iframe.contentWindow.document;}var documentHead = contentDocument.head;if(!documentHead) {documentHead = contentDocument.getElementsByTagName('head').item(0);}iframeDocumentHead = documentHead;iframeDocument = contentDocument;var importScriptDom = contentDocument.createElement('script');importScriptDom.setAttribute('type', 'text/javascript');importScriptDom.setAttribute('src', "https://www.google.com/jsapi?key=ABQIAAAAI6_79ENphTcjH-5zEKIjtxRQhxWdq7uC7NB9t3geTmQOqILs0hSwMWWXNgg_vOYMX8KNqWUCq_CFpQ");importScriptDom.onreadystatechange = function () {if (this.readyState == 'loaded' || this.readyState == 'complete') {resizeChart();}};importScriptDom.onload = function () {resizeChart();};documentHead.appendChild(importScriptDom);}function redraw() {redrawWithSize('100%', '100%');}function redrawWithSize(width, height) {if(iframeChartDiv) {iframeDocument.body.removeChild(iframeChartDiv);}if(chartScriptDom) {iframeDocumentHead.removeChild(chartScriptDom);}var chartDiv = iframeDocument.createElement('div');chartDiv.setAttribute('id', 'chart_div');chartDiv.style.width = '100%';chartDiv.style.height = '100%';iframeDocument.body.appendChild(chartDiv);iframeDocument.body.style.overflow = 'hidden';iframeDocument.body.style.margin = 0;iframeDocument.body.style.padding = 0;iframeChartDiv = chartDiv;var scriptDom = iframeDocument.createElement('script');scriptDom.setAttribute('type', 'text/javascript');var scriptSrc = "function drawChart() {var data = new google.visualization.DataTable(); data.addColumn('string', 'Topping'); data.addColumn('number', 'Slices'); data.addRows([ ['not specified', 100] ]); var options = {title:'pie chart', colors:['#777'],width:'100%', height:'"+height+"', is3D: false, tooltipText: 'both', legend: 'right'}; var chart = new google.visualization.PieChart(document.getElementById('chart_div')); chart.draw(data, options);} google.load('visualization', '1', {packages: ['corechart'], callback: drawChart});";try {scriptDom.innerHTML = scriptSrc;} catch(e) {scriptDom.text = scriptSrc;}chartScriptDom = scriptDom;iframeDocumentHead.appendChild(scriptDom);}function resizeChart() {if(resizeTimer) clearTimeout(resizeTimer);if(parent) {if(parent.document.getElementById('form:rowHeight')) {var height = parent.document.getElementById('form:rowHeight').value;var cols = parent.document.getElementById('form:cols').value;var width = parent.getColWidth() - (30);var isRedraw = false;if(oldWidth) {if(oldWidth != width) {isRedraw = true;}} else {isRedraw = true;}if(oldHeight) {if(oldHeight != height) {isRedraw = true;}} else {isRedraw = true;}oldWidth = width;oldHeight = height;if(isRedraw) {document.getElementById('chart_div').style.height = (height - 90) - (height / 10) +'px';document.getElementById('chart_div').style.width = width+'px';iframeEl.style.width = '100%';iframeEl.style.height = document.getElementById('chart_div').style.height;redrawWithSize(document.getElementById('chart_div').style.width, document.getElementById('chart_div').style.height);}}else {document.getElementById('chart_div').style.height = '100%';document.getElementById('chart_div').style.width = '100%';iframeEl.style.width = '100%';iframeEl.style.height = '100%';redrawWithSize(document.getElementById('chart_div').style.width, document.getElementById('chart_div').style.height);return;}} else {return;}resizeTimer = setTimeout(resizeChart, 50);}createIframe();</script></td></tr></table>

[Isidoros]

There has been an error in the code, actually an extra "," now is
working properly thank you.
It appears that IE is very strict in parsing while Firefox and chrome
did manage to parse and ignore the error.
Thank you