0
嗨我在我的控制檯中獲得Uncaught TypeError: google.visualization.LineChart。未捕獲TypeError：google.visualization.LineChart
我的代碼在今天之前工作。
這是我的2谷歌路線圖的全碼：
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<link href='https://fonts.googleapis.com/css?family=Muli:400,400italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Roboto:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type='text/javascript'>//<![CDATA[
google.charts.load('current', {'packages':['line', 'corechart']});
google.charts.setOnLoadCallback(drawChart);
google.charts.setOnLoadCallback(drawChart2);
function drawChart() {
var chartDiv = document.getElementById('chart_div');
var data = new google.visualization.DataTable();
data.addColumn('datetime', 'Month');
data.addColumn('number', "Total Donation Ratio");
data.addColumn('number', "Total Trophies");
data.addRows([
[new Date(2016, 1, 28, 1, 45), 0.4815, 48592],
[new Date(2016, 1, 28, 15, 01), 0.4963, 48693],
[new Date(2016, 1, 28, 16, 02), 0.4963, 48711],
[new Date(2016, 1, 28, 16, 02), 0.4963, 48711]
]);
var formatter = new google.visualization.DateFormat({pattern: 'd MMM, yyyy, hh:mm a'});
formatter.format(data,0);
var classicOptions = {
crosshair: { trigger: 'both' },
title: 'Total Donation Ratio and Total Trophies',
textStyle: {
fontName: 'Muli'
},
titleTextStyle: {
fontName: 'Muli'
},
height: 450,
series: {
0: { //Donation
targetAxisIndex: 0,
pointSize: 5,
lineWidth: 5,
curveType: 'function'
},
1: { //Trophies
targetAxisIndex: 1,
pointSize: 3,
lineWidth: 4,
curveType: 'function',
color: '#b8860b'
}
},
vAxes: {
// Adds titles to each axis.
0: {title: 'Donation Ratio'},
1: {title: 'Trophies'}
},
hAxis: {
title: 'Timeline (GMT +8)',
textStyle: {
fontName: 'Muli'
},
titleTextStyle: {
fontName: 'Muli',
fontSize: 18,
italic: false
}
},
vAxis: {
textStyle: {
fontName: 'Muli'
},
titleTextStyle: {
fontName: 'Muli',
fontSize: 20,
italic: true,
bold: true
}
}
};
var classicChart = new google.visualization.LineChart(chartDiv);
classicChart.draw(data, classicOptions);
}
// CHART 2
function drawChart2() {
var chartDiv2 = document.getElementById('chart_div2');
var data = new google.visualization.DataTable();
data.addColumn('datetime', 'Month');
data.addColumn('number', "Troops Donated");
data.addColumn({type: 'number', role:'annotation'});
data.addRows([
[new Date(2016, 1, 27, 16, 45), 73, 73],
[new Date(2016, 1, 27, 17, 15), 7, 7],
[new Date(2016, 1, 27, 18, 15), 60, 60],
[new Date(2016, 1, 27, 18, 45), 50, 50],
[new Date(2016, 1, 27, 20, 15), 56, 56],
[new Date(2016, 1, 27, 20, 45), 90, 90],
[new Date(2016, 1, 27, 21, 15), 20, 20],
[new Date(2016, 1, 27, 22, 15), 76, 76],
[new Date(2016, 1, 27, 22, 45), 10, 10],
[new Date(2016, 1, 27, 23, 15), 45, 45],
[new Date(2016, 1, 27, 23, 45), 6, 6],
[new Date(2016, 1, 28, 1, 45), 61, 61],
[new Date(2016, 1, 28, 15, 01), 652, 652],
]);
var formatter = new google.visualization.DateFormat({pattern: 'd MMM, yyyy, hh:mm a'});
formatter.format(data,0);
var classicOptions = {
//backgroundColor: '#f7f7f7',
legend: { position: 'top', alignment: 'start' },
title: 'Troops Donated in the Last 24 Hours',
textStyle: {
fontName: 'Muli'
},
titleTextStyle: {
fontName: 'Muli'
},
height: 250,
series: {
0: {
pointSize: 8,
lineWidth: 3,
curveType: 'function',
color: '#001f3f'
}
},
vAxes: {
0: {title: 'Troops Donated'},
},
hAxis: {
title: 'Timeline (GMT +8)',
textStyle: {
fontName: 'Muli'
},
titleTextStyle: {
fontName: 'Muli',
fontSize: 18,
italic: false
}
},
vAxis: {
viewWindow: {
min: [0]
},
textStyle: {
fontName: 'Muli'
},
titleTextStyle: {
fontName: 'Muli',
fontSize: 20,
italic: true,
bold: true
}
}
};
var classicChart2 = new google.visualization.LineChart(chartDiv2);
classicChart2.draw(data, classicOptions);
}
//]]>
</script>
</head>
<body>
<div id="chart_div2"></div>
<div id="chart_div"></div>
</body>
這裏是我的小提琴手https://jsfiddle.net/4nsas23k/
我跟着從谷歌圖表文檔的例子。任何想法有什麼不對？
這是彈出所有的地方......它是由一個版本的新版本，並與緩存一些衝突引起的。如果你加載了一個特定的版本號，而不是最新版本，它應該可以工作。這是一個應該自行解決的臨時問題。 – nbering