Ledger Nano X - The secure hardware wallet
SHARE
TWEET

Google Spreadsheet to a Google Maps Webpage

ZaynerTech Feb 15th, 2014 146 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1.  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html>
  4.   <head>
  5.     <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
  6.     <style type="text/css">
  7.       html { height: 100% }
  8.       body { height: 100%; margin: 0; padding: 0 }
  9.       #map-canvas { height: 100% }
  10.     </style>
  11. <!-- Acquire your google maps API Key https://developers.google.com/maps/documentation/javascript/tutorial -->
  12.     <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDPahUaopfWbadpOpOLolZuPX-pX129kF4&sensor=true">
  13.     </script>
  14.     <script type="text/javascript">
  15. //<![CDATA[
  16.  
  17. var map;
  18.  function loadMapJSON(json)
  19.  {
  20.  
  21.  for (var i = 0; i < json.feed.entry.length; i++) {
  22.     var entry = json.feed.entry[i];
  23.  
  24.    
  25.     if(entry["gsx$name"].$t) {
  26.       var lat = parseFloat(entry["gsx$latitude"].$t);
  27.       var lng = parseFloat(entry["gsx$longitude"].$t);
  28.       var myLatlng = new google.maps.LatLng(lat,lng);
  29.       var label = entry["gsx$name"].$t;
  30.       var marker = new google.maps.Marker({
  31.       position: myLatlng,
  32.       map: map,
  33.       title: label
  34.       });
  35.     }
  36.   }
  37. }
  38.  
  39. function m_getJSON() {
  40. var mapOptions = {
  41.           center: new google.maps.LatLng(30, 10),
  42.           zoom: 2,
  43.           mapTypeId: google.maps.MapTypeId.ROADMAP
  44.         };
  45.         map = new google.maps.Map(document.getElementById("map-canvas"),mapOptions);
  46.  
  47.  
  48.  
  49.   // Retrieve the JSON feed.
  50.   var script = document.createElement('script');
  51.  
  52. // The spreadsheet should be formatted like this :
  53. //https://docs.google.com/spreadsheet/ccc?key=0AvR75gIJvkFUdEtMSDJnY0tTN0Z0WXlhZDdhLUdJM2c&usp=drive_web#gid=0
  54. //Acquire this URL from the Google spreadsheet by looking at File->Publish to Web->Get A Link to
  55. //Published Data-> Choose ATOM and copy link and replace below up and add ?alt=json-in-script&ndplr=1&//callback=loadMapJSON on the end
  56.  
  57.   script.setAttribute('src', 'https://spreadsheets.google.com/feeds/list/0AvR75gIJvkFUdEtMSDJnY0tTN0Z0WXlhZDdhLUdJM2c/od6/public/values?alt=json-in-script&ndplr=1&callback=loadMapJSON');
  58.   script.setAttribute('id', 'jsonScript');
  59.   script.setAttribute('type', 'text/javascript');
  60.   document.documentElement.firstChild.appendChild(script);
  61.  
  62.  
  63. }
  64.  
  65.       google.maps.event.addDomListener(window, 'load', m_getJSON);
  66. //]]>
  67.  
  68.     </script>
  69.   </head>
  70.   <body>
  71.     <div id="map-canvas"/>
  72.   </body>
  73. </html>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Top