Показать сообщение отдельно
  #1 (permalink)  
Старый 20.02.2015, 04:05
Аватар для Sanu0074
Аспирант
Отправить личное сообщение для Sanu0074 Посмотреть профиль Найти все сообщения от Sanu0074
 
Регистрация: 16.12.2012
Сообщений: 80

Как создать несколько графиков GoogleCharts на одной странице?
Этот код не работает, создается график только для первого блока:
google.load("visualization", "1", {packages:["corechart"]});
                    google.setOnLoadCallback(drawChart1);
                    function drawChart1() {
                      var data1 = google.visualization.arrayToDataTable([
                        ["Element", "", { role: "style" }, { role: 'annotation' }  ],
                        ['x1',27, "#07618e",'27'],
                        ['x2',41, "#00905c",'41'],
                        ['x3',1.031, "#e19035",'1.031']
                      ]);

                        var view1 = new google.visualization.DataView(data1);
                              view1.setColumns([0, 1,
                                               { calc: "stringify",
                                                 sourceColumn: 3,
                                                 type: "string",
                                                 role: "annotation" },
                                               2]);

                      var options1 = { 
                        titlePosition: 'in', axisTitlesPosition: 'in',
                        hAxis: {showTextEvery: '1', textPosition: 'out'}, 
                        vAxis: {textPosition: 'out'},
                        legend: {position: 'none'},
                        backgroundColor: { fill:'transparent' },
                        is3D: true
                      };
                      var chart1 = new google.visualization.BarChart(document.getElementById('map_1_dg'));
                        google.visualization.events.addListener(chart1, 'ready', myReadyHandler1);
                        function myReadyHandler1(){$('text').attr('fill','#ffffff');}
                        chart1.draw(view1, options1);
                    }
                                    google.load("visualization", "1", {packages:["corechart"]});
                    google.setOnLoadCallback(drawChart2);
                    function drawChart2() {
                      var data2 = google.visualization.arrayToDataTable([
                        ["Element", "", { role: "style" }, { role: 'annotation' }  ],
                        ['x1',27, "#07618e",'27'],
                        ['x2',41, "#00905c",'41'],
                        ['x3',1.031, "#e19035",'1.031']
                      ]);

                        var view2 = new google.visualization.DataView(data2);
                              view2.setColumns([0, 1,
                                               { calc: "stringify",
                                                 sourceColumn: 3,
                                                 type: "string",
                                                 role: "annotation" },
                                               2]);

                      var options2 = { 
                        titlePosition: 'in', axisTitlesPosition: 'in',
                        hAxis: {showTextEvery: '1', textPosition: 'out'}, 
                        vAxis: {textPosition: 'out'},
                        legend: {position: 'none'},
                        backgroundColor: { fill:'transparent' },
                        is3D: true
                      };
                      var chart2 = new google.visualization.BarChart(document.getElementById('map_2_dg'));
                        google.visualization.events.addListener(chart2, 'ready', myReadyHandler2);
                        function myReadyHandler2(){$('text').attr('fill','#ffffff');}
                        chart2.draw(view2, options2);
                    }
                                    google.load("visualization", "1", {packages:["corechart"]});
                    google.setOnLoadCallback(drawChart3);
                    function drawChart3() {
                      var data3 = google.visualization.arrayToDataTable([
                        ["Element", "", { role: "style" }, { role: 'annotation' }  ],
                        ['x1',27, "#07618e",'27'],
                        ['x2',41, "#00905c",'41'],
                        ['x3',1.031, "#e19035",'1.031']
                      ]);

                        var view3 = new google.visualization.DataView(data3);
                              view3.setColumns([0, 1,
                                               { calc: "stringify",
                                                 sourceColumn: 3,
                                                 type: "string",
                                                 role: "annotation" },
                                               2]);

                      var options3 = { 
                        titlePosition: 'in', axisTitlesPosition: 'in',
                        hAxis: {showTextEvery: '1', textPosition: 'out'}, 
                        vAxis: {textPosition: 'out'},
                        legend: {position: 'none'},
                        backgroundColor: { fill:'transparent' },
                        is3D: true
                      };
                      var chart3 = new google.visualization.BarChart(document.getElementById('map_3_dg'));
                        google.visualization.events.addListener(chart3, 'ready', myReadyHandler3);
                        function myReadyHandler3(){$('text').attr('fill','#ffffff');}
                        chart3.draw(view3, options3);
                    }
Ответить с цитированием