类型错误：google.visualization未定义

Question

我试图与谷歌的图表API的工作，但我得到一个错误，我不明白：

这里是我的代码：

<script type="text/javascript" src="https://www.google.com/jsapi"></script> 
<script type="text/javascript" src="js/statistics/overview.js"></script> 

而代码从overview.js是这样的：

var statisticsOverview = { 
    init: function() { 
     google.load("visualization", "1", {packages: ["corechart"]}); 
     google.setOnLoadCallback(this.drawIncomeChart()); 
     google.setOnLoadCallback(this.drawExpensesChart()); 
     google.setOnLoadCallback(this.drawEconomiesChart()); 
    }, 
    drawIncomeChart: function() { 
     var data = [ 
      ['Year', 'Income'], 
      ['October 2013', 1000], 
      ['January 2014', 1170], 
      ['March 2014', 660] 
     ]; 
     var options = { 
      title: 'Income Performance', 
      colors: ['green'] 
     }; 
     var id = 'chart_income'; 

     this.drawLineChart(data, options, id); 
    }, 
    drawExpensesChart: function() { 
     var data = [ 
      ['Year', 'Expense'], 
      ['October 2013', 1000], 
      ['January 2014', 1170], 
      ['March 2014', 660] 
     ]; 
     var options = { 
      title: 'Expense Performance', 
      colors: ['red'] 
     }; 
     var id = 'chart_expenses'; 
     this.drawLineChart(data, options, id); 
    }, 
    drawEconomiesChart: function() { 
     var data = [ 
      ['Year', 'Savings'], 
      ['2004', 1000], 
      ['2005', 1170], 
      ['2006', 660], 
      ['2007', 1030] 
     ]; 

     var options = { 
      title: 'Savings Performance', 
      colors: ['orange'] 
     }; 

     var id = 'chart_economies'; 
     this.drawLineChart(data, options, id); 
    }, 
    drawLineChart: function(data, options, id) { 
     console.log(google.visualization); 
     var chartData = google.visualization.arrayToDataTable(data); 

     var chart = new google.visualization.LineChart(document.getElementById(id)); 
     chart.draw(chartData, options); 
    } 
}; 

statisticsOverview.init(); 

这很奇怪，因为console.log（）会给我的谷歌对象的属性可视化。我究竟做错了什么？

Answer 1

定时问题。通常你叫谷歌图表像

google.load("visualization", "1", {packages:["corechart"]}); 
    google.setOnLoadCallback(drawChart); 
    function drawChart() { 
    ... 
    } 

所以，当可视化包加载函数绘制被调用。现在

，你的情况一切后完成的，所以你要做的：

google.load("visualization", "1", {packages: ["corechart"]}); 

function doStats() { 

var statisticsOverview = { 
    init: function() { 
     console.log('init'); 
     this.drawIncomeChart(); 
     this.drawExpensesChart(); 
     this.drawEconomiesChart(); 
    }, 
    ... 
};  

statisticsOverview.init() 
} 

google.setOnLoadCallback(doStats); 

类似的结果可以用

setTimeout(function() { 
    statisticsOverview.init(); 
}, 3000); 

没有包装函数得到。