Thanks for your help. I finally figured out what happened.
Everything went right after using <table> to enclose the <div> tab. Very weird, this only happens in IE but not in firefox, chrome and safrai On Fri, Jul 19, 2013 at 1:48 PM, asgallant <[email protected]>wrote: > If you post your full page code or a link to the page, I will take a look > and see what might be causing it. > > > On Friday, July 19, 2013 1:47:31 AM UTC-4, asgallant wrote: >> >> It could be HTML, it could be CSS, it could be javascript if you have >> scripts that modify the CSS on elements - this is the case when you have >> tabs on your page (as one example). >> >> On Friday, July 19, 2013 12:29:39 AM UTC-4, Chan Tai Man wrote: >>> >>> Thanks dude. >>> >>> So there should be something wrong in the html tags. >>> >>> On Friday, July 19, 2013 11:48:58 AM UTC+8, asgallant wrote: >>>> >>>> I don't see anything wrong in your javascript. I copied it into a >>>> jsfiddle, made a substitute data set, and tested it; it works just fine in >>>> IE: >>>> http://jsfiddle.net/asgallant/**H5YfE/<http://jsfiddle.net/asgallant/H5YfE/>. >>>> When the axis labels are not visible, that is usually due to one of two >>>> things: either the API isn't being loaded properly (which is not the case >>>> here), or the charts are being drawn in hidden divs. >>>> >>>> On Thursday, July 18, 2013 11:06:50 PM UTC-4, Chan Tai Man wrote: >>>>> >>>>> I have created a php containing 4-5 line charts. Everything works fine >>>>> in all browsers except in IE, in which the data of vAxis and hAxis cannot >>>>> be shown after the 2nd chart. However, the tooltip can display the hAxis >>>>> and vAxis data correctly, even in the charts with no axis data. >>>>> >>>>> the arrays I passed to google.visualization.**arrayToDataTable() are >>>>> of the same format and is exactly same as that in Google examples. >>>>> >>>>> Here is my scripts to create the charts. >>>>> >>>>> google.load("visualization", "1", >>>>> {packages:["corechart"]}); >>>>> google.setOnLoadCallback(**drawChart); >>>>> var start = "<?php echo $dataRange[1]; ?>"; >>>>> var end = "<?php echo $dataRange[$NumRecords]; ?>"; >>>>> var isA2Set = parseInt("<?php echo $A2Set; ?>"); >>>>> function drawChart() { >>>>> if(isA2Set == 1){ >>>>> var tmp2 = <?php echo json_encode($A2); ?>; >>>>> var data2 = google.visualization.**arrayToDataTable(tmp2); >>>>> var options2 = { >>>>> chartArea: {left:60, width: 700}, >>>>> hAxis: {gridlines: {count: -1}, title: 'Date Range', titleTextStyle: >>>>> {color: '#000066', fontSize: 16}}, >>>>> pointSize: 6, >>>>> title: 'Asiasat 2 Utilization From ' + start + ' To ' + end, >>>>> titleTextStyle: {color: 'black', fontName: 'Arial', fontSize: 20}, >>>>> vAxis: {fontName: 'Calibri (Body)', fontSize: 16, gridlines: >>>>> {count:6}, maxValue:100, minValue:0, title: 'Bandwidth usage in %', >>>>> titleTextStyle: {color: '#000066', fontSize: 20}} >>>>> }; >>>>> } >>>>> var tmp3S = <?php echo json_encode($A3S); ?>; >>>>> var data3S = google.visualization.**arrayToDataTable(tmp3S); >>>>> var options3S = { >>>>> chartArea: {left:60, width: 700}, >>>>> hAxis: {gridlines: {count: -1}, title: 'Date Range', titleTextStyle: >>>>> {color: '#000066', fontSize: 16}}, >>>>> pointSize: 6, >>>>> title: 'Asiasat 3S Utilization From ' + start + ' To ' + end, >>>>> titleTextStyle: {color: 'black', fontName: 'Arial', fontSize: 20}, >>>>> vAxis: {fontName: 'Calibri (Body)', fontSize: 16, gridlines: >>>>> {count:6}, maxValue:100, minValue:0, title: 'Bandwidth usage in %', >>>>> titleTextStyle: {color: '#000066', fontSize: 20}} >>>>> }; >>>>> var tmp4 = <?php echo json_encode($A4); ?>; >>>>> var data4 = google.visualization.**arrayToDataTable(tmp4); >>>>> var options4 = { >>>>> chartArea: {left:60, width: 700}, >>>>> hAxis: {gridlines: {count: -1}, title: 'Date Range', titleTextStyle: >>>>> {color: '#000066', fontSize: 16}}, >>>>> pointSize: 6, >>>>> title: 'Asiasat 4 Utilization From ' + start + ' To ' + end, >>>>> titleTextStyle: {color: 'black', fontName: 'Arial', fontSize: 20}, >>>>> vAxis: {fontName: 'Calibri (Body)', fontSize: 16, gridlines: >>>>> {count:6}, maxValue:100, minValue:0, title: 'Bandwidth usage in %', >>>>> titleTextStyle: {color: '#000066', fontSize: 20}} >>>>> }; >>>>> var tmp5 = <?php echo json_encode($A5); ?>; >>>>> var data5 = google.visualization.**arrayToDataTable(tmp5); >>>>> var options5 = { >>>>> chartArea: {left:60, width: 700}, >>>>> hAxis: {gridlines: {count: -1}, title: 'Date Range', titleTextStyle: >>>>> {color: '#000066', fontSize: 16}}, >>>>> pointSize: 6, >>>>> title: 'Asiasat 5 Utilization From ' + start + ' To ' + end, >>>>> titleTextStyle: {color: 'black', fontName: 'Arial', fontSize: 20}, >>>>> vAxis: {fontName: 'Calibri (Body)', fontSize: 16, gridlines: >>>>> {count:6}, maxValue:100, minValue:0, title: 'Bandwidth usage in %', >>>>> titleTextStyle: {color: '#000066', fontSize: 20}} >>>>> }; >>>>> var tmp7 = <?php echo json_encode($A7); ?>; >>>>> var data7 = google.visualization.**arrayToDataTable(tmp7); >>>>> var options7 = { >>>>> chartArea: {left:60, width: 700}, >>>>> hAxis: {gridlines: {count: -1}, title: 'Date Range', titleTextStyle: >>>>> {color: '#000066', fontSize: 16}}, >>>>> pointSize: 6, >>>>> title: 'Asiasat 7 Utilization From ' + start + ' To ' + end, >>>>> titleTextStyle: {color: 'black', fontName: 'Arial', fontSize: 20}, >>>>> vAxis: {fontName: 'Calibri (Body)', fontSize: 16, gridlines: >>>>> {count:6}, maxValue:100, minValue:0, title: 'Bandwidth usage in %', >>>>> titleTextStyle: {color: '#000066', fontSize: 20}} >>>>> }; >>>>> if(isA2Set == 1){ >>>>> var chart2 = new google.visualization.**LineChart(document.** >>>>> getElementById('chart_A2')); >>>>> chart2.draw(data2, options2); >>>>> } >>>>> var chart3S = new google.visualization.**LineChart(document.** >>>>> getElementById('chart_A3S')); >>>>> chart3S.draw(data3S, options3S); >>>>> var chart4 = new google.visualization.**LineChart(document.** >>>>> getElementById('chart_A4')); >>>>> chart4.draw(data4, options4); >>>>> var chart5 = new google.visualization.**LineChart(document.** >>>>> getElementById('chart_A5')); >>>>> chart5.draw(data5, options5); >>>>> var chart7 = new google.visualization.**LineChart(document.** >>>>> getElementById('chart_A7')); >>>>> chart7.draw(data7, options7); >>>>> } >>>>> >>>>> I have tried to create the charts in a separate function but it did >>>>> not work. And I must display all these charts in a page and they will only >>>>> use IE. >>>>> >>>>> All the arrays get the correct data. >>>>> >>>>> Can anyone help? >>>>> >>>> -- > You received this message because you are subscribed to a topic in the > Google Groups "Google Visualization API" group. > To unsubscribe from this topic, visit > https://groups.google.com/d/topic/google-visualization-api/M2w6TCCvqkk/unsubscribe > . > To unsubscribe from this group and all its topics, send an email to > [email protected]. > To post to this group, send email to > [email protected]. > Visit this group at > http://groups.google.com/group/google-visualization-api. > For more options, visit https://groups.google.com/groups/opt_out. > > > -- You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. Visit this group at http://groups.google.com/group/google-visualization-api. For more options, visit https://groups.google.com/groups/opt_out.
