Google chart does not load in Firefox11

920 views
Skip to first unread message

Phanibhushan Reddy

unread,
Apr 23, 2012, 11:16:24 AM4/23/12
to Google Visualization API
I have a simple line chart that works fine with IE but fails to load
in Firefox 11. Can someone help as to what is the issue and possible
trouble shooting steps?

Thanks,

asgallant

unread,
Apr 23, 2012, 12:59:28 PM4/23/12
to google-visua...@googlegroups.com
Open the Firefox developer console (ctrl+shft+J) and reload the page.  You should see some sort of error there.

If you post your code or a link to the page, we can help you debug.

Allen Fuller

unread,
Apr 23, 2012, 6:54:48 PM4/23/12
to google-visua...@googlegroups.com
I'm having the same problem. We have several charts on one page and the last few do not load in FF11. Everything else works just fine.

When I looked at the Error Console, I see the error "the container is null or not defined"

Any suggestions would be really appreciated!

Phanibhushan Reddy

unread,
Apr 24, 2012, 1:07:54 AM4/24/12
to google-visua...@googlegroups.com

I do see an error in the console. Below is the abstract of the error. I am also attaching a screenshot.

m("google.visualization.arrayToDataTable",function(a,b){var c=new U,e,f,h;O(a)||d(n("Not an array"));if(0==a[D])return c;O(a[0])||d(n(Dg));var j=a[0][D];for(e=1;e<a[D];e++)(!O(a[e])||a[e][D]!=j)&&d(n(Dg));var o=(e=!b)?a[0]:[],s=e?a[fb](1,a[D]):a,w=[];for(f=0;f<j;f++){var z=cm;for(e=0;e<s[D];e++)if(h=s[e][f],N(h)){P(h)?z=cm:Q(h)?z=Xk:O(h)?z=qm:typeof h==Ch?z=Ch:(kn(h)&&d(n("Date and datetime column types are not supported")),d(n("Invalid value in "+e+xe+f)));break}w[f]=z}for(f=0;f<j;f++)c[Ed](w[f],

asgallant

unread,
Apr 24, 2012, 10:04:28 AM4/24/12
to google-visua...@googlegroups.com
Post your code or a link to the page and I'll help you debug.

asgallant

unread,
Apr 24, 2012, 10:04:36 AM4/24/12
to google-visua...@googlegroups.com
Post your code or a link to the page and I'll help you debug. 

Allen Fuller

unread,
Apr 24, 2012, 11:20:15 AM4/24/12
to google-visua...@googlegroups.com
Thanks! Here's the link:

asgallant

unread,
Apr 24, 2012, 12:21:55 PM4/24/12
to google-visua...@googlegroups.com
Hmm...I'm not familiar with the method you are using to create charts, but unless I miss my guess, that is the code for embedding charts, correct?

I tested it several times, and sometimes the charts draw, and sometimes they don't.  My suspicion is that one of two things is going on (maybe both):

1) There is a problem in the way the embedding code handles multiple embedded charts.  Fixing this would be out of your hands, so the solution is to use javascript to build the charts instead.
2) There is a problem with the interaction between the code that hides your page subsections and the drawing of the charts.  To render properly, the charts need to be drawn in a visible div (they can be hid immediately afterwards).  The chart embedding code doesn't expose anything that would allow you to determine when the charts are done drawing, so you can't fire the code to hide the div's with 100% certainty that it will work properly.  The solution, again, is to use javascript to build the charts.

As a test case, try disabling the code that hides your page sections and see what happens.  If the charts consistently draw properly, then the problem is likely #2.

Freddy

unread,
Apr 25, 2012, 5:53:27 AM4/25/12
to google-visua...@googlegroups.com
Here is my code for the line chart.


<script type="text/javascript" src="https://www.google.com/jsapi"></script>
          <script type="text/javascript">
                google.load("visualization", "1", {packages:["corechart"]});
                      google.setOnLoadCallback(drawChart);  
                           function drawChart()
                           {
   
   var data = google.visualization.arrayToDataTable([
['Month', 'Revenue', 'Expenses'],
['Jan', 123400.00, 98780.00],
['Feb', 114700.00, 109120.00],
['Mar', 134500.00, 101560.00],
['Apr', 111390.00, 99230.00],
['May', , ],
['June', , ]]);

var options = {
//title: 'Revenue-Expense Analysis'
};

        var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
         chart.draw(data, options);          
      }      
     
      </script>
 



--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To view this discussion on the web visit https://groups.google.com/d/msg/google-visualization-api/-/xVlcVTnxYf4J.

To post to this group, send email to google-visua...@googlegroups.com.
To unsubscribe from this group, send email to google-visualizati...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en.

Jinji

unread,
Apr 25, 2012, 6:17:25 AM4/25/12
to google-visua...@googlegroups.com
I'm having troubles testing right now, but I assume this is because of the blank array elements - e.g, ['May', , ]. Replace with explicit nulls - ['May', null, null].

Freddy

unread,
Apr 25, 2012, 6:19:21 AM4/25/12
to google-visua...@googlegroups.com
But, it works fine in IE, placing null would make a difference in Firefox?

Thanks for the suggestion, let me try

Freddy

Jinji

unread,
Apr 25, 2012, 6:26:20 AM4/25/12
to google-visua...@googlegroups.com
FF11 (don't know about other browsers, didn't have a chance to check) doesn't parse ['a', , ] as a 3-element array. It thinks it's actually ['a', null] - a 2-elements array, which is bad input for arrayToDataTable.
Reply all
Reply to author
Forward
0 new messages