For the Google Maps exercises in Week 1 and 2 we are using GitHub as our primary development platform. This repository is a template and you will deploy it into your own GitHub account, modify the provided files and create your own solutions. During the practical lab you will submit URLs to the various resources here.
You will find associated starter files here and instructions how to proceed in the D2L checklist titled Week 1 and 2 Checklist: Google Maps
First step is to deploy the template into your own account.
- Find and click the green "Use This Template" button at the top of the window at https://github.com/FlemingGeom/googlemaps-shawnmflemingc.
- Set the Repository Name as exactly
geom99lab1
(PS: this is case sensitive, so all lowercase please!) - Make the repository Public.
- Click Create Repository from Template to start the migration. Once complete, it will open to the ReadMe.md in the root of the repository under your account. You now have a "copy" of all files and can modify, edit and use these files to learn.
- Click the
Settings
icon, near the top-right side of the GitHub window - Scroll to the bottom and look for
Pages
entry in the left selection, click it. - Under
Source: Branch
, selectMain
. Leave the other settings as Root - Click
Save
to commit this.
Now your repository will be accessible under GitHub Pages (an HTML Web Server) at https://[username].github.io/geom99lab1
where [username]
is your GitHub account username and the repository name is pl1
. Note you must type this manually into the URL above, or better yet, modify the ReadMe.md to change [username] to be your actual username!
In this repository you will need to create content in this repository from the following activities:
- Google MyMaps Sharkspotters tutorial.
- Maps - Simple HTML Map Example
- Routes - Directions API - URL request JSON response
- Modify Dynamic Map Clustering example to show Ontario Parks
- Create your Story using Google Dynamic Maps (JavaScript) in the provided folder
Optional Tip: You can check the above boxes by editing this MarkDown document and adding an
x
between the[ ]
, like this:[x]
Please individually complete all items listed in the D2L checklist before the indicated due date. Many items will be checked at the start of your lab in Week 3 and if not complete will be graded as a 0/incomplete.
Google Maps is a pay-per-use service for developers and requires a valid API Key to function. Through an educational grant we have been given a few keys that we can use. Whenever the documentation asks for a key you can use one of the two available. There are two types of keys available this year:
A referral is the address of the web page where a someone clicked the link that sent them to the page (in this case the various Google API's). The repository URL works only with a specific GitHub Repository name to protect its usage. The URL must be exactly https://[username].github.io/geom99lab1/
followed by the directory and filename you want to see, where [username]
is replaced with your actual GitHub account's username.
Some items (like Directions API) do not accept Referral URLs as are meant to be used server-side (aka locally on your computer). To provide access here a second key is provided that is restricted only by the IP address of the calling computer. This key will work on the Fleming labs and VDI (optionally, if your computer IP is provided during your first scheduled lab, on your local computer as long as that IP is valid).
Both keys are provided within the Geom99 Desire2learn Checklist and are restricted to provide access to only the following:
Directions API, Distance Matrix API, Geocoding API, Geolocation API, Maps Elevation API, Maps Embed API, Maps JavaScript API, Maps Static API, Places API, Roads API, Street View Static API, Time Zone API
The API Keys you must use are provided in Desire2Learn Geom99 class. It is not recommended to create your own account and keys without first consulting with the instructor.
(Like what you see? You can find more Google Maps samples on GitHub here: https://github.com/googlemaps/js-samples)