Hi there
I am trying to display the same graph twice on the same page. here is my code script type="text/javascript" src="https://www.gstatic.com/charts/loader.js";></script> <script type="text/javascript"> // Bar chart google.charts.load('current', { packages: ['corechart', 'bar'] }); google.charts.setOnLoadCallback(Mygraph); google.charts.setOnLoadCallback(Mygraph2); function Mygraph() { $.ajax({ async: false, url: "GetGraph", dataType: "json", success: function (jsonData) { var data = new google.visualization.DataTable(); data.addColumn('string', 'Question'); data.addColumn('number', 'My Perfomance'); data.addColumn('number', 'Peers Performance'); for (var i = 0; i < jsonData.length; i++) { data.addRow([jsonData[i].rateName, jsonData[i].myRate, jsonData[i].peerRate]); } var view = new google.visualization.DataView(data); view.setColumns([0, 1, { calc: "stringify", sourceColumn: 1, type: "string", role: "interval", }, 2, { calc: "stringify", sourceColumn: 2, type: "string", role: "interval" }]); var options = { title: '', chartArea: { width: '50%' }, backgroundColor: '#ffffff ', hAxis: { title: 'Rating', minValue: 0, textStyle: { bold: true, fontSize: 12, color: '#4d4d4d' }, titleTextStyle: { bold: true, fontSize: 18, color: '#4d4d4d' } }, vAxis: { title: 'Performance', textStyle: { fontSize: 14, bold: true, color: '#848484' }, titleTextStyle: { fontSize: 14, bold: true, color: '#848484' } } }; var chart = new google.visualization.ColumnChart(document.getElementById('chart_div')); chart.draw(view, options); } }); } function Mygraph2() { $.ajax({ async: false, url: "GetGraph", dataType: "json", success: function (jsonData) { var data = new google.visualization.DataTable(); data.addColumn('string', 'Question'); data.addColumn('number', 'My Perfomance'); data.addColumn('number', 'Peers Performance'); for (var i = 0; i < jsonData.length; i++) { data.addRow([jsonData[i].rateName, jsonData[i].myRate, jsonData[i].peerRate]); } var view = new google.visualization.DataView(data); view.setColumns([0, 1, { calc: "stringify", sourceColumn: 1, type: "string", role: "interval", }, 2, { calc: "stringify", sourceColumn: 2, type: "string", role: "interval" }]); var options = { title: '', chartArea: { width: '50%' }, backgroundColor: '#ffffff ', hAxis: { title: 'Rating', minValue: 0, textStyle: { bold: true, fontSize: 12, color: '#4d4d4d' }, titleTextStyle: { bold: true, fontSize: 18, color: '#4d4d4d' } }, vAxis: { title: 'Performance', textStyle: { fontSize: 14, bold: true, color: '#848484' }, titleTextStyle: { fontSize: 14, bold: true, color: '#848484' } } }; var chart = new google.visualization.ColumnChart(document.getElementById('chart_div2')); chart.draw(view, options); } }); } </script> Only the bottom graph is showing please help -- You received this message because you are subscribed to the Google Groups "Google Chart API" group. To unsubscribe from this group and stop receiving emails from it, send an email to google-chart-api+unsubscr...@googlegroups.com. To post to this group, send email to google-chart-api@googlegroups.com. Visit this group at https://groups.google.com/group/google-chart-api. For more options, visit https://groups.google.com/d/optout.
