TypeError：google.visualization.DataTableはコンストラクタではありません

Question

私のウェブページには、Googleマップと3つのチャートがあります。ページが読み込まれると地図は正常ですが、グラフは読み込まれないか、1つまたは2つだけが読み込まれます。エラーが発生し続けるTypeError：google.visualization.DataTableはコンストラクタではありません。

function load() { 
    //map object 
     var MY_MAP = new google.maps.Map(document.getElementById("map"), { 
     center: {lat: 54.870902, lng: -6.300565}, 
     zoom: 14 
     });  
     //call to get and process data 
     downloadUrl("Map.php", processXML); 
    } 

// Load the Visualization API and the piechart package. 
     google.load('visualization', '1.0', {'packages':['corechart']}); 
     // Set a callback to run when the Google Visualization API is loaded. 
google.setOnLoadCallback(drawAltitudeChart()); 
google.setOnLoadCallback(drawDisplacementChart()); 
google.setOnLoadCallback(drawDistanceChart()); 



function drawAltitudeChart(){ 

     //console.log('hello'); 
     var graph = []; 
      downloadUrl("Map.php", function (data){ 
       var xml = data.responseXML; 
       var markers = xml.documentElement.getElementsByTagName("marker"); 
       var dataTable = new google.visualization.DataTable(); 
       var options = {title:'Altitude (m above sea level)', 
        curveType:'function', 
        legend:{position:'bottom'}, 
        is3d:true  
       }; 
       var chart; 

       for(var i = 0; i<markers.length; i++){ 
        graph[i] = ['', parseInt(markers[i].getAttribute("alt"))]; 
       } 

       dataTable.addColumn('string', 'id'); 
       dataTable.addColumn('number', 'Altitude'); 
       dataTable.addRows(graph); 


       chart = new google.visualization.LineChart(document.getElementById('curve_chart')); 
       chart.draw(dataTable, options); 

      }); 
     } 

Answer 1

このようなコールバックを複数追加することはできません。

また、あなたは上記のload文が古いライブラリ用ですので...

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

function drawCharts() { 
    drawAltitudeChart(); 
    drawDisplacementChart(); 
    drawDistanceChart(); 
} 

---

EDIT

のように、load方法でコールバックを定義することができます。 ..

に応じて0

... 新しいライブラリを使用して

The version of Google Charts that remains available via the jsapi loader is no longer being updated consistently. Please use the new gstatic loader from now on.

...

<script src="https://www.gstatic.com/charts/loader.js"></script>

がload声明への変更...

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

あなたはまた、例えば、あなたが1つの load文で必要なすべてのパッケージをロードすることができ

EDIT 2

代わりに...

google.charts.load('current', { 'packages': ['table'] }); 
google.charts.load('current', { 'packages': ['bar'] }); 
google.charts.load('current', { 'packages': ['pie'] }); // <-- 'pie' package does not exist 
google.charts.load('current', { 'packages': ['corechart'] }); 
google.charts.setOnLoadCallback(drawCharts); 

それは...

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

Answer 2

私は、同じメッセージを持ってしなければならないが、私はパッケージをロードする

// was -> google.charts.load('current', {'packages':['bar', 'corechart']}); 
    google.charts.load('current', {'packages':['bar', 'corechart', 'table']});