Javascript 类型错误：google.visualization.DataTable 不是构造函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32458437/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
TypeError: google.visualization.DataTable is not a constructor
提问by fst104
On my web page I have a google map, as well as three charts. When the page loads the map is fine, but the charts either don't load or only one or two do. Keep getting the error TypeError: google.visualization.DataTable is not a constructor.
在我的网页上，我有一张谷歌地图和三个图表。当页面加载地图时很好，但图表要么不加载，要么只有一两个。不断收到错误 TypeError: google.visualization.DataTable is not a constructor。
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);
});
}
回答by WhiteHat
I don't think you can add more than one callback like that.
我认为您不能添加多个这样的回调。
Also, you can define the callback in the loadmethod, like so...
此外，您可以在load方法中定义回调，就像这样......
google.load('visualization', '1.0', {'packages':['corechart'], 'callback': drawCharts});
function drawCharts() {
drawAltitudeChart();
drawDisplacementChart();
drawDistanceChart();
}
EDIT
编辑
the above loadstatement is for the olderlibrary...
以上load声明适用于较旧的图书馆...
<script src="http://www.google.com/jsapi"></script>
<script src="http://www.google.com/jsapi"></script>
according to the release notes...
根据发行说明...
The version of Google Charts that remains available via the
jsapiloader is no longer being updated consistently. Please use the new gstatic loader from now on.
通过
jsapi加载程序仍然可用的 Google Charts 版本不再持续更新。请从现在开始使用新的 gstatic 加载器。
using the newlibrary...
使用新库...
<script src="https://www.gstatic.com/charts/loader.js"></script>
<script src="https://www.gstatic.com/charts/loader.js"></script>
changes the loadstatement to...
将load语句更改为...
google.charts.load('current', {'packages': ['corechart'], 'callback': drawCharts});
EDIT 2
编辑 2
you can also load all the packages you need in one loadstatement, e.g.
instead of...
您还可以在一个load语句中加载您需要的所有包，例如，
而不是...
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);
it should be...
它应该是...
google.charts.load('current', {
callback: drawCharts,
packages: ['bar', 'corechart', 'table']
});
回答by kztd
I got the same message, but just because I forgot to load the package
我收到了同样的消息，但只是因为我忘记加载包
// was -> google.charts.load('current', {'packages':['bar', 'corechart']});
google.charts.load('current', {'packages':['bar', 'corechart', 'table']});
