要在谷歌GeoChart地图上添加链接,可以通过以下步骤完成:
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
google.charts.load
方法加载GeoChart库。代码如下:google.charts.load('current', {
'packages': ['geochart'],
'mapsApiKey': 'YOUR_API_KEY' // 替换为你的Google Maps API密钥
});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Country');
data.addColumn('number', 'Value');
data.addColumn({type: 'string', role: 'tooltip', 'p': {'html': true}}); // 添加tooltip列
// 添加地图数据
data.addRows([
['US', 300, '<a href="https://example.com">United States</a>'],
['CA', 200, '<a href="https://example.com">Canada</a>'],
// 添加更多地图数据...
]);
var options = {
// 设置地图样式和配置选项
};
var chart = new google.visualization.GeoChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
<div>
元素用于显示地图。代码如下:<div id="chart_div"></div>
YOUR_API_KEY
处。这样,你就成功地在谷歌GeoChart地图上添加了链接。当用户点击地图上的区域时,将会跳转到相应的链接页面。
请注意,以上代码示例中的链接仅作为示范,你可以根据实际需求修改链接地址和地图数据。
领取专属 10元无门槛券
手把手带您无忧上云