实现谷歌API可视化后的空白页?



我已经使用Safari和谷歌浏览器作为网络浏览器,它们都显示空白页。但是当我在 html 文件中编写一个段落时,它只显示段落,而不是 javascript 部分。我将我的javascript文件命名为map.js。

文件:

<!DOCTYPE html>
<html>
<head>
<script src="map.js"></script>
</head>
<body>

</body>
</html>

JAVASCRIPT 文件:

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {'packages':['geochart', 'corechart']});
google.charts.setOnLoadCallback(drawRegionsMap);
google.charts.setOnLoadCallback(drawChart);
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'Customer Count', 'Agent Count'],
['Argentina', 999000, 100],
['Australia', 969000, 450],
['Belgium', 12000, 200],
['Brazil', 850000, 250],
['Canada', 1110000, 590],
['China', 3975000, 690],
['Colombia', 4500, 100],
['Denmark', 78600, 150],
['France', 67000, 400],
['Germany', 140000, 550],
['India', 1060000, 560],
['Japan', 60000, 420],
['Nigeria', 1054000, 305],
['Philippines', 120000, 230],
['Russia', 2904000, 180],
['Singapore', 79000, 450],
['South Korea', 15000, 290],
['Switzerland', 35000, 230],
['United Kingdom', 4015000, 750],
['United States', 5000500, 1500],
]);
var options = {
colorAxis: {colors: ['#eee8f3', '#ddd1e7','#ccbadc','#bba3d0','#aa8cc5','#9975b9','#885ead', '#7647a2', '#663096', '#551a8b']},
legend: 'none',
};
var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
chart.draw(data, options);
}
</script>

Javascrip 是运行在 html 页面后面的逻辑。Javascript 不会在页面上呈现(或显示(。它可以操作页面上已经存在的 html 元素,或者在指示时添加新元素。

尝试从简单的示例和教程开始,https://www.w3schools.com/html/default.asp 学习 HTML,https://www.w3schools.com/js/default.asp 学习 JavaScript。

最新更新