Created
October 3, 2014 04:40
-
-
Save smowtion/cda92cde69bab6494f57 to your computer and use it in GitHub Desktop.
// source http://jsbin.com/yacego/1
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src="http://code.jquery.com/jquery-git2.js"></script> | |
| <script type="text/javascript" src="https://www.google.com/jsapi"></script> | |
| <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDlN48smo55Cl48b71XpXuFD7OhJ5pktls&sensor=false"></script> | |
| <script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.12/src/infobox.js"></script> | |
| <meta charset="utf-8"> | |
| <title>JS Bin</title> | |
| </head> | |
| <body> | |
| <div id="google_countrymap" class="text-center" style="width:100%;"> | |
| <img alt="loading..." src="http://s.statstool.com/templates/common_assets/img/preloader.gif" /> | |
| </div> | |
| <script id="jsbin-javascript"> | |
| function drawGoogleMaps() { | |
| var data = new google.visualization.DataTable(); | |
| data.addRows(6); | |
| data.addColumn('string', 'Country'); | |
| data.addColumn('number', 'Daily Visitors(%)'); | |
| data.setValue(0, 0, 'United States'); | |
| data.setValue(0, 1, 22.2); | |
| data.setValue(1, 0, 'India'); data.setValue(1, 1, 8); | |
| data.setValue(2, 0, 'Brazil'); | |
| data.setValue(2, 1, 4.1); | |
| data.setValue(3, 0, 'United Kingdom'); | |
| data.setValue(3, 1, 3.2); | |
| data.setValue(4, 0, 'Germany'); | |
| data.setValue(4, 1, 3.2); | |
| data.setValue(5, 0, 'vn'); | |
| data.setValue(5, 1, 6.2); | |
| var options = { | |
| dataMode: 'regions', | |
| width: '100%', | |
| colorAxis: {colors: ['#e7711c', '#4374e0']} // orange to blue | |
| }; | |
| var chart = new google.visualization.GeoMap(document.getElementById('google_countrymap')); | |
| chart.draw(data, options); | |
| } | |
| if(google!=null){ | |
| // Load the Visualization API library and the piechart library. | |
| google.load('visualization', '1.0', { 'packages':['corechart','geomap'] }); | |
| // Set a callback to run when the Google Visualization API is loaded. | |
| google.setOnLoadCallback(drawGoogleMaps); | |
| if($( window ).width()< 400){ | |
| var window_width= $( window ).width()- 10; | |
| var old_src = $("#alexaGraphic").attr('src'); | |
| var new_src = old_src.replace("w=400","w="+window_width); | |
| $("#alexaGraphic").attr('src',new_src); | |
| } | |
| //set resize | |
| $(window).resize(function(){ | |
| initialize();// google maps | |
| drawGoogleMaps(); | |
| }); | |
| }; | |
| </script> | |
| <script id="jsbin-source-html" type="text/html"><!DOCTYPE html> | |
| <html> | |
| <head> | |
| <script src="//code.jquery.com/jquery-git2.js"><\/script> | |
| <script type="text/javascript" src="https://www.google.com/jsapi"><\/script> | |
| <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDlN48smo55Cl48b71XpXuFD7OhJ5pktls&sensor=false"><\/script> | |
| <script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/infobox/1.1.12/src/infobox.js"><\/script> | |
| <meta charset="utf-8"> | |
| <title>JS Bin</title> | |
| </head> | |
| <body> | |
| <div id="google_countrymap" class="text-center" style="width:100%;"> | |
| <img alt="loading..." src="http://s.statstool.com/templates/common_assets/img/preloader.gif" /> | |
| </div> | |
| </body> | |
| </html></script> | |
| <script id="jsbin-source-javascript" type="text/javascript">function drawGoogleMaps() { | |
| var data = new google.visualization.DataTable(); | |
| data.addRows(6); | |
| data.addColumn('string', 'Country'); | |
| data.addColumn('number', 'Daily Visitors(%)'); | |
| data.setValue(0, 0, 'United States'); | |
| data.setValue(0, 1, 22.2); | |
| data.setValue(1, 0, 'India'); data.setValue(1, 1, 8); | |
| data.setValue(2, 0, 'Brazil'); | |
| data.setValue(2, 1, 4.1); | |
| data.setValue(3, 0, 'United Kingdom'); | |
| data.setValue(3, 1, 3.2); | |
| data.setValue(4, 0, 'Germany'); | |
| data.setValue(4, 1, 3.2); | |
| data.setValue(5, 0, 'vn'); | |
| data.setValue(5, 1, 6.2); | |
| var options = { | |
| dataMode: 'regions', | |
| width: '100%', | |
| colorAxis: {colors: ['#e7711c', '#4374e0']} // orange to blue | |
| }; | |
| var chart = new google.visualization.GeoMap(document.getElementById('google_countrymap')); | |
| chart.draw(data, options); | |
| } | |
| if(google!=null){ | |
| // Load the Visualization API library and the piechart library. | |
| google.load('visualization', '1.0', { 'packages':['corechart','geomap'] }); | |
| // Set a callback to run when the Google Visualization API is loaded. | |
| google.setOnLoadCallback(drawGoogleMaps); | |
| if($( window ).width()< 400){ | |
| var window_width= $( window ).width()- 10; | |
| var old_src = $("#alexaGraphic").attr('src'); | |
| var new_src = old_src.replace("w=400","w="+window_width); | |
| $("#alexaGraphic").attr('src',new_src); | |
| } | |
| //set resize | |
| $(window).resize(function(){ | |
| initialize();// google maps | |
| drawGoogleMaps(); | |
| }); | |
| }; | |
| </script></body> | |
| </html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| function drawGoogleMaps() { | |
| var data = new google.visualization.DataTable(); | |
| data.addRows(6); | |
| data.addColumn('string', 'Country'); | |
| data.addColumn('number', 'Daily Visitors(%)'); | |
| data.setValue(0, 0, 'United States'); | |
| data.setValue(0, 1, 22.2); | |
| data.setValue(1, 0, 'India'); data.setValue(1, 1, 8); | |
| data.setValue(2, 0, 'Brazil'); | |
| data.setValue(2, 1, 4.1); | |
| data.setValue(3, 0, 'United Kingdom'); | |
| data.setValue(3, 1, 3.2); | |
| data.setValue(4, 0, 'Germany'); | |
| data.setValue(4, 1, 3.2); | |
| data.setValue(5, 0, 'vn'); | |
| data.setValue(5, 1, 6.2); | |
| var options = { | |
| dataMode: 'regions', | |
| width: '100%', | |
| colorAxis: {colors: ['#e7711c', '#4374e0']} // orange to blue | |
| }; | |
| var chart = new google.visualization.GeoMap(document.getElementById('google_countrymap')); | |
| chart.draw(data, options); | |
| } | |
| if(google!=null){ | |
| // Load the Visualization API library and the piechart library. | |
| google.load('visualization', '1.0', { 'packages':['corechart','geomap'] }); | |
| // Set a callback to run when the Google Visualization API is loaded. | |
| google.setOnLoadCallback(drawGoogleMaps); | |
| if($( window ).width()< 400){ | |
| var window_width= $( window ).width()- 10; | |
| var old_src = $("#alexaGraphic").attr('src'); | |
| var new_src = old_src.replace("w=400","w="+window_width); | |
| $("#alexaGraphic").attr('src',new_src); | |
| } | |
| //set resize | |
| $(window).resize(function(){ | |
| initialize();// google maps | |
| drawGoogleMaps(); | |
| }); | |
| }; |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment