Приведенный ниже код создает простую карту мира по регионам и отображает некоторые данные при наведении курсора мыши. Документ API показывает, что щелчок даже можно добавить, но, к сожалению, я не нашел на нем никакого документа, как добавить URL-ссылку для другой веб-страницы в определенный регион (страну).
Я короче, когда я нажимаю на регион/страну, он должен отображать связанную страницу, содержащую подробную информацию, предоставленную моим приложением базы данных.
<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'],
// Note: you will need to get a mapsApiKey for your project.
// See: https://developers.google.com/chart/interactive/docs/basic_load_libs#load-settings
'mapsApiKey': 'AIzaSyD-9tSrke72PouQMnMX-a7eZSW0jkFMBWY'
});
google.charts.setOnLoadCallback(drawRegionsMap);
var j = "{{ind}}".replace(/"/g,"\"")
function drawRegionsMap() {
var data = google.visualization.arrayToDataTable([
['Country', 'Popularity'],
['Germany', 200],
['United States', 300],
['Brazil', 400],
['Pakistan', 500],
['France', 600],
['RU', 700],
]);
var options = {};
var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="regions_div" style="width: 1400px; height: 1200px;"></div>
</body>
</html>
