Re: Charts not appearing on Internet Explorer 8

[asgallant]

Without a working example, it's hard to tell, but my suspicion is that the JSON returned by the $.getJSON call isn't 100% valid - check to see if you have any errant commas at the end of arrays or objects, ie: [1, 2, 3, 4,] - that last comma will cause IE to bomb.

On Saturday, August 25, 2012 1:27:55 AM UTC-4, Gaby wrote:

Hello!

A friend and I are working on a project where a user can select a specific "unit" from a select box and a total of four charts will be displayed for each unit with data from a table. There are two line charts (Testplan Line Chart and Cycles Line Chart), and two column charts (Testplan Bar Chart and Pass/Fail Bar Chart) It seems to work fine on Google chrome and Firefox;however, the charts do not appear on Internet Explorer 8. I pasted the function that loads the charts and attached the html file. Please Help! Thanks! :)

function load_charts() {

testplan=[];

cycles=[];

pass_fail=[];

testplan.push(['ww', 'Testplan', 'Coded','Coverage']);

cycles.push(['ww','Total Cycles']);

pass_fail.push(['ww','Total Tests Passing','Total Tests Failing']);

var unit = $('#unit_select').val();

$('.'+unit).children('.ww').each(function(i) { 

var ww = $(this).html();

ww = ww.substring(1,ww.length-1);

var testplan_row = [];

var cycles_row = [];

var pass_fail_row = [];

// Construct a new row of Testplan data

testplan_row.push(ww);

testplan_row.push(parseFloat($(".testplan"+ww+unit).html()));

testplan_row.push(parseFloat($(".coded"+ww+unit).html()));

testplan_row.push(parseFloat($(".cov"+ww+unit).html()));

testplan.push(testplan_row);

// Construct a new row of Cycle data

cycles_row.push(ww);

cycles_row.push(parseFloat($(".cycles"+ww+unit).html()));

cycles.push(cycles_row);

// Construct a new row of pass-fail data

pass_fail_row.push(ww);

pass_fail_row.push(parseFloat($(".passing"+ww+unit).html()));

pass_fail_row.push(parseFloat($(".total"+ww+unit).html())-parseFloat($(".passing"+ww+unit).html()));

pass_fail.push(pass_fail_row);

});

testplan_data = google.visualization.arrayToDataTable(testplan);

line_testplan_options = {

   title: 'Test Plan Line Chart',

height: chart_height,

width: chart_width,

vAxis: {title: "Number of Tests"},

hAxis: {title: "Work Week"}

};

var line_testplan = new google.visualization.LineChart(document.getElementById('line_testplan'));

line_testplan.draw(testplan_data, line_testplan_options);

var bar_testplan = new google.visualization.ColumnChart(document.getElementById('bar_testplan'));

bar_testplan_options = {

   title: 'Test Plan Bar Chart',

height: chart_height,

width: chart_width,

vAxis: {title: "Number of Tests"},

hAxis: {title: "Work Week"}

};

bar_testplan.draw(testplan_data, bar_testplan_options);

cycles_data = google.visualization.arrayToDataTable(cycles);

cycles_options = {

   title: 'Cycles Line Chart',

height: chart_height,

width: chart_width,

vAxis: {title: "Number of Cycles"},

hAxis: {title: "Work Week"}

};

var line_cycles = new google.visualization.LineChart(document.getElementById('line_cycles'));

line_cycles.draw(cycles_data, cycles_options);

pass_fail_options = {

   title: 'Pass/Fail Bar Chart',

height: chart_height,

width: chart_width,

vAxis: {title: "Pass/Fail Numbers"},

hAxis: {title: "Work Week"},

isStacked:true 

};

pass_fail_data = google.visualization.arrayToDataTable(pass_fail);

var bar_pass_fail = new google.visualization.ColumnChart(document.getElementById('bar_pass_fail'));

bar_pass_fail.draw(pass_fail_data, pass_fail_options);

}

[Gaby]

I checked to see if I had any trailing commas but didn't see any. I attached the printed JSON. 

[asgallant]

The problem appears to be this line:

ww = ww.substring(1, ww.length - 1); 

which, in IE 8, is returning only the last digit of ww.  I assume the purpose of this is to trim all whitespace, which can be accomplished using regex replace or (since you are already using jQuery) the jQuery built-in trim method:

ww = $.trim(ww);

Or, you could just not put the whitespace in the table to begin with.

[Gabriela Gil]

Thank you so much!!!!!!!!! It works now :)

--
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/-/gBrJj6SO51kJ.

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.

[asgallant]

You're welcome.

To unsubscribe from this group, send email to google-visualization-api+unsub...@googlegroups.com.