google-visualization - 是否可以在 GeoChart 中突出显示美国的某些州和加拿大的某些州?
问题描述
我正在尝试在位置页面上添加地图,并且当用户将鼠标悬停在地图的特定部分时,我想在不同地区选择美国和加拿大的一些州。基本上是北美和南美(巴西和阿根廷)不同地区的地图。
在下面的代码中,我试图突出显示 2 个美国州和 1 个加拿大州。但是当我尝试突出显示大陆上的州时,出现“请求的地图不存在”错误。
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', {
'packages': ['geochart'],
'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
});
google.charts.setOnLoadCallback(drawRegionsMap);
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['State', 'Offices'],
['New Jersey', 2],
['Alabama', 3],
['Toronto', 1]
]);
var options = {
region: '019', // Americas Continent
colorAxis: {
colors: ['#00853f', 'black', '#e31b23']
},
backgroundColor: '#81d4fa',
datalessRegionColor: 'gray',
defaultColor: '#f5f5f5',
resolution: 'provinces'
};
var chart = new google.visualization.GeoChart(document.getElementById('geochart-colors'));
chart.draw(data, options);
};
</script>
</head>
<body>
<div id="geochart-colors" style="width: 100%; height: 100%;"></div>
</body>
</html>
有可能这样做吗?我怎样才能实现像所附图像一样的东西?
我非常感谢您的时间和帮助。谢谢!
解决方案
推荐阅读
- docker - 连接到redis docker容器时出错
- node.js - 如何在 typegoose 中使用更新的钩子?
- sql - 如何使用“SELECT FOR UPDATE”锁定一组行
- arrays - 在 JavaScript 中使用数组时确定效率(大 O 表示法)
- sql-server - 如何区分 SQL Server 中的 2 个阿拉伯字母
- python - 编写一个程序,首先读取输入文件的名称,然后是两个字符串,表示搜索范围的下限和上限
- java - 设置 iText 文档的 BackgroundColor
- javascript - 在本机反应中显示来自firebase的图像(命中错误)
- video - ffmpeg 缩放 4k 视频并添加字幕
- c - 从 crtdefs.h 获取错误