Google Visualization APIを使用しているときに問題が発生しています。Google Visualization API - グラフが表示されない
私はどこが間違っているのかわかりません。ここで
は、HTMLコードは(私は重要な部分を残した)です:
<html>
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Arquivo CSS -->
<link rel="stylesheet" type="text/css" href="style.css">
<!-- Arquivo js externo -->
<script type="text/javascript" src="script.js"></script>
<!-- Google Visualization API -->
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<!-- Arquivos Bootstrap -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div id="line_chart"> <!— The chart should appear here!! —> </div>
</body>
ここscript.jsファイルです:
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Year', 'Goiania', 'Jataí', 'Catalão', 'Goiás', 'Total'],
['2005', 58, 11, 9, 1, 79 ],
['2006', 63, 15, 14, 1, 93 ],
['2007', 66, 18, 16, 1, 101 ],
['2008', 66, 20, 19, 1, 106 ],
['2009', 81, 21, 24, 3, 129 ],
['2010', 85, 23, 25, 3, 136 ],
['2011', 86, 23, 25, 3, 137 ],
['2012', 86, 24, 25, 3, 138 ],
['2013', 89, 24, 25, 5, 143 ],
['2014', 90, 25, 26, 6, 147 ],
['2015', 90, 25, 26, 7, 148 ]
]);
var options = {
title: 'Testando Gráfico de Anos',
legend: { position: 'bottom' }
};
var chart = new google.visualization.LineChart(document.getElementById('line_chart'));
chart.draw(data, options);
}
が、私は私の外部の.jsファイルを呼び出してみました体の終わりには、しかし、いずれも成功しません。私はdrawChart関数をhtmlコードのどこにでも呼び出さないことを知っていますが、ははscript.jsファイルで関数がonloadと呼ばれると思っています。
ありがとうございました。 :)(コードが理解しにくい場合は申し訳ありませんが、できるだけきれいに見せるようにしました)。
JSコンソールに入り、関数を呼び出します。それは何をするためのものか? script.jsが404'dになっているようです – nkconnor