隨機得到：「類型錯誤：google.visualization.DataTable不是構造函數」

我在我的網頁的一個描繪幾個圖表，但我隨機獲得在控制檯中出現以下錯誤：隨機得到：「類型錯誤：google.visualization.DataTable不是構造函數」

TypeError: google.visualization.DataTable is not a constructor

我我試圖通過只顯示一個圖表來縮小問題的範圍，但我仍然收到錯誤消息，大約50％的時間內沒有繪製圖表。當我沒有得到錯誤時，圖表正確繪製。

我讀過多個論壇和this documentation但我看不出什麼是錯的。除了我的函數在setOnLoadCallback之前被聲明，否則他們得到undefined，我的代碼與上述文檔基本相同。

我的一些（簡化）代碼：

MyPage.php：

<!DOCTYPE html> 
<html> 
    <head> 
    // loading CSS 
    </head> 
    <body> 
     <p>My page content...</p> 
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script> 
      <script src="https://www.gstatic.com/charts/loader.js"></script> 
      <script src="/js/home.js" type="text/javascript"></script> 
      // loading more scripts (moment.js, query.countdown.js, bootstrap.js...) 
    </body> 
</html>

在home.js：

$(document).ready(function(){ 
    if (window.location.href == 'XXXXXController') { 

    // This chart draws a dual axis chart showing revenues and expenses 
    function drawRevenuesExpenses() { 
     var jsonData = $.ajax({ 
      type: "POST", 
      url: "/draw_dual_lineChart", 
      data: "someParameters", 
      dataType:"json" 
      }).done(function (jsonData) {   
       // Create our data table out of JSON data loaded from server. 
       var data_chart = new google.visualization.DataTable(jsonData[0]['data']); 
       // Set chart's options 
       var options = jsonData[1]['options']; 
       // Instantiate and draw the chart 
       var chart = new google.visualization.LineChart(document.getElementById('dual_chart_revenues_expenses')); 
       chart.draw(data_chart, options); 
      }); 
    } 

    // This chart draws the resort's affluence (number of tourists per day) 
    function drawAffluence() { 
     var jsonData = $.ajax({ 
      type: "POST", 
      url: "/draw_single_lineChart", 
      data: "someParameters", 
      dataType:"json" 
      }).done(function (jsonData) {   
       // Create our data table out of JSON data loaded from server. 
       var data_chart = new google.visualization.DataTable(jsonData[0]['data']); 
       // Set chart's options 
       var options = jsonData[1]['options']; 
       // Instantiate and draw the chart 
       var chart = new google.visualization.LineChart(document.getElementById('single_chart_affluence')); 
       chart.draw(data_chart, options); 
      }); 
    } 

    google.charts.load('current', {'packages':['corechart']}); 
    google.charts.setOnLoadCallback(drawRevenuesExpenses); 
    //google.charts.setOnLoadCallback(drawAffluence); 
    } 
}

來源

2017-05-08 remyremy

的文件是在這一點上很陳舊...

不建議使用多個setOnLoadCallback聲明

實際上，你可以直接放置callback在load聲明

，你可以依靠callback知道什麼時候該頁面已準備就緒

不需要 - >$(document).ready

試下面的設置，先天下之憂負荷谷歌...

google.charts.load('current', { 
    callback: drawCharts, 
    packages: ['corechart'] 
}); 

function drawCharts() { 
    if (window.location.href == 'XXXXXController') { 
     $.ajax({ 
      type: "POST", 
      url: "/draw_dual_lineChart", 
      data: "someParameters", 
      dataType:"json" 
     }).done(function (jsonData) { 
      // Create our data table out of JSON data loaded from server. 
      var data_chart = new google.visualization.DataTable(jsonData[0]['data']); 
      // Set chart's options 
      var options = jsonData[1]['options']; 
      // Instantiate and draw the chart 
      var chart = new google.visualization.LineChart(document.getElementById('dual_chart_revenues_expenses')); 
      chart.draw(data_chart, options); 
     }); 

     $.ajax({ 
      type: "POST", 
      url: "/draw_single_lineChart", 
      data: "someParameters", 
      dataType:"json" 
     }).done(function (jsonData) { 
      // Create our data table out of JSON data loaded from server. 
      var data_chart = new google.visualization.DataTable(jsonData[0]['data']); 
      // Set chart's options 
      var options = jsonData[1]['options']; 
      // Instantiate and draw the chart 
      var chart = new google.visualization.LineChart(document.getElementById('single_chart_affluence')); 
      chart.draw(data_chart, options); 
     }); 
    } 
    } 
}

來源

2017-05-08 14:05:04 WhiteHat

我重組我的代碼如你所說：移動它的'$（文件）.ready'之外，但是刪除了所有''setOnLoadCallback直接在'load'聲明加載'drawCharts'，我仍然會遇到同樣的問題。有兩點需要提及：我需要在'drawCharts'函數之後放置'load'語句，或者它不確定;一個簡單的F5總是觸發錯誤。當我刷新緩存（Firefox中的CTRL + R）時，圖表正確顯示。我懷疑加載文件/模塊時出現了問題...... – remyremy

這已經在頁面的底部，並且有一些其他的'

惠特除非你需要在使用之前加載表格圖表，否則eHat對所有內容都是正確的。就像這樣：

google.charts.load("current", { 
     packages : [ "corechart","table" ] 
    });

來源

2017-11-27 10:08:22 Skywalker

相關問題

隨機得到：「類型錯誤：google.visualization.DataTable不是構造函數」

回答

相關問題