回答編集履歴

1

追記

2017/02/27 09:39

投稿

date
date

スコア1820

test CHANGED
@@ -1,3 +1,101 @@
1
1
  geochartの世界地図を使うのも手段としてはあると思います
2
2
 
3
3
  [https://developers.google.com/chart/interactive/docs/gallery/geochart](https://developers.google.com/chart/interactive/docs/gallery/geochart)
4
+
5
+
6
+
7
+ 追記 2017/02/27 18:40
8
+
9
+ 例えばこんな風になる
10
+
11
+ 日本でgoogleブラジルでyahooに飛ぶように設定している
12
+
13
+
14
+
15
+ ```HTML
16
+
17
+ <html>
18
+
19
+ <head>
20
+
21
+ <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
22
+
23
+ <script type="text/javascript">
24
+
25
+ google.charts.load('current', {'packages':['geochart']});
26
+
27
+ google.charts.setOnLoadCallback(drawRegionsMap);
28
+
29
+
30
+
31
+ function drawRegionsMap() {
32
+
33
+
34
+
35
+ var data = google.visualization.arrayToDataTable([
36
+
37
+ ['国', 'Popularity'],
38
+
39
+ ['日本', '日本'],
40
+
41
+ ['ブラジル', 'ブラジル']
42
+
43
+ ]);
44
+
45
+ var options = {};
46
+
47
+ var chart = new google.visualization.GeoChart(document.getElementById('regions_div'));
48
+
49
+ function selectHandler() {
50
+
51
+ var selectedItem = chart.getSelection()[0];
52
+
53
+ var row = selectedItem.row
54
+
55
+ if (selectedItem) {
56
+
57
+ switch (row){
58
+
59
+ case 0:
60
+
61
+ url ="https://www.google.co.jp/";
62
+
63
+ break;
64
+
65
+ case 1:
66
+
67
+ url ="http://www.yahoo.co.jp/";
68
+
69
+ break;
70
+
71
+ }
72
+
73
+ window.location.href = url;
74
+
75
+ }
76
+
77
+ }
78
+
79
+ google.visualization.events.addListener(chart, 'select', selectHandler);
80
+
81
+ chart.draw(data, options);
82
+
83
+ }
84
+
85
+ </script>
86
+
87
+ </head>
88
+
89
+ <body>
90
+
91
+ <div id="regions_div" style="width: 900px; height: 500px;"></div>
92
+
93
+ </body>
94
+
95
+ </html>
96
+
97
+
98
+
99
+ ```
100
+
101
+ ![イメージ説明](2810a727e10bebf8428663a4a4c1f044.jpeg)