谷歌图表列名称覆盖

时间:2018-08-21 09:26:49

标签: javascript charts google-api google-visualization

我在循环中使用过Google图表。我正在从api获取数据,并且正在循环打印图表,它工作正常,但条下面的列名称被覆盖,它对单个条工作正常,但对于多个条则不能调整其名称。

google.charts.load('current', {packages: ['corechart','bar']});                
     $http.get(PUBLIC_URL+'apiname/'+$scope.form.isno).then(function success(response) {
        google.charts.setOnLoadCallback(function() { drawBasic(response.data); });

     });                   

     function drawBasic(chartData) {
         angular.forEach(chartData, function(value, key) {
                var chartDataArray = [];
                chartDataArray.push(['Bar', 'Index']);
                angular.forEach(value, function(v, k) {                     
                    chartDataArray.push([v.name, parseInt(v.data)]);                        
                });
                //console.log(chartDataArray);
                var data = google.visualization.arrayToDataTable(chartDataArray);

                var title = 'Revenue vs Profit';

                var options = {
                    title : title,
                    legend: { position: 'none' }
                };

                var chart = new google.visualization.ColumnChart(document.getElementById("chart_div"+(key+1)));
                // var chart = new google.visualization.ColumnChart(document.getElementById('chart_div1'));
                chart.draw(data, options);
            });
        }  

chartDataArray示例:

[
  ['Bar', 'Index'],
  ['2012',  900],
  ['2013',  1000],
  ['2014',  1170],
  ['2015',  1250],
  ['2016',  1530]
]

0 个答案:

没有答案
相关问题