Skip to content

Instantly share code, notes, and snippets.

@isovector
Forked from zhenyanghua/code.gs
Created July 7, 2019 17:44
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save isovector/b1d66104c46d9cebac9cc2e17a78df64 to your computer and use it in GitHub Desktop.
Save isovector/b1d66104c46d9cebac9cc2e17a78df64 to your computer and use it in GitHub Desktop.
Googlemaps + Google Sheets + Google Forms
var SPREADSHEET_ID='Google Sheets ID';
var SHEET_NAME = 'Google Sheets Table Name';
function doGet(request) {
var callback = request.parameters.jsonp;
var range = SpreadsheetApp.openById(SPREADSHEET_ID).getSheetByName(SHEET_NAME).getDataRange();
var json = callback+'('+Utilities.jsonStringify(range.getValues())+')';
return ContentService.createTextOutput(json).setMimeType(ContentService.MimeType.JAVASCRIPT);
}
We can make this file beautiful and searchable if this error is corrected: It looks like row 2 should actually have 2 columns, instead of 3. in line 1.
Timestamp Place Name Address
7/15/2014 10:29:43 home Salem,MA
7/15/2014 11:06:02 Nearby Beverly,MA
7/15/2014 11:23:44 Big City Boston,MA
7/15/2014 11:35:20 Many Auto shops Peabody,MA
7/15/2014 11:37:04 Autos.. Danvers,MA
7/15/2014 12:22:18 Commute Wonderland Station, MA
<!DOCTYPE html>
<html>
<head>
<title>Googlemaps + Google Sheets + Google Forms</title>
<style>
html,body{
margin:0;
padding:0;
width:100%;
height:100%;
}
#map_canvas{
float:left;
width:50%;
height:100%;
}
#panel{
float:right;
width:50%;
height:100%;
background-color:#000;
}
#gform{
height: calc(100% - 22px);
}
</style>
</head>
<script src="https://maps.google.com/maps/api/js?sensor=false"></script>
<script>
var DATA_SERVICE_URL="https://script.google.com/macros/s/AKfycbxHrqv5x-2lCtZJ1W49q0rjU6ATnSLZWAtJADqBj1Kil32H80pL/exec?jsonp=callback";
var geocoder;
var map;
function initialize() {
//Create a geocoder
geocoder = new google.maps.Geocoder();
map=new google.maps.Map(document.getElementById('map_canvas'),{
center:new google.maps.LatLng(42.456187,-71.0653),
zoom:10,
maxZoom:20,
mapTypeId:google.maps.MapTypeId.ROADMAP
});
//Inject JavaScript (returned JSON) into the head of the page.
var scriptElement=document.createElement('script');
scriptElement.src=DATA_SERVICE_URL;
document.getElementsByTagName('head')[0].appendChild(scriptElement);
}
function callback(data) {
for (var i=1;i<data.length;i++) {
address=data[i][2];
//Geocode the JSON returned from callback function.
codeAddress();
}
}
function codeAddress(){
//Google Async service.
geocoder.geocode({'address':address},function(results,status){
if (status == google.maps.GeocoderStatus.OK) {
var marker = new google.maps.Marker({
position:results[0].geometry.location,
map:map
});
}else{
alert('Geocode was not successful for the following reason:' + status);
}
});
}
</script>
<body onload="initialize()">
<div id="map_canvas"></div>
<div id="panel">
<div id="ctrl">
<input type="button" value="Update Map" onclick="document.location.reload(true)">
</div>
<div id="gform">
<iframe id="form" src="https://docs.google.com/forms/d/1u0aw5rz6JFfJf0KvjYn900VMOLWlI8yfiQnKysZFHaA/viewform?embedded=true" width="100%" height="100%" frameborder="0" marginheight="0" marginwidth="0">Loading...</iframe>
</div>
</div>
</body>
</html>
@isovector
Copy link
Author

isovector commented Jul 10, 2019

@@ links
- `hello world <https://haskell.org>`_
+ [hello world](https://haskell.org)

@@ inline code
- ``foo :: Int``
+ `foo :: Int`

@@ headings
- This is a big long title
- ========================
+ # This is a big long title

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment