dr. martin zhao sept 4, 2015. topics html and related tutorials on w3schools.com related html tags...
TRANSCRIPT
Google Maps APIDr. Martin Zhao
Sept 4, 2015
Topics HTML and related tutorials on
w3schools.com Related HTML tagsAdding interesting features using JavaScriptWhat is Google Maps API?Application mashup using Google Maps APIJSON: JavaScript Object Notation
Elements of HTML: Tags Found in (almost) all HTML
<head> <body>
Block level elements<p> <div>
Embedding programs<script>
JavaScript: What Can You Do With It?JavaScript is the programming language of HTML
and the Web JavaScript Can Change HTML ContentJavaScript Can Validate DataJavaScript Can Change Images
How to Mark Places on a Map?You have options:
Make you map with place marked and include it in your HTML
Include a map with a <canvas> tag (available in HTML5) and use JavaScript to draw markers on it
Using Google Maps APIPros and Cons
What is API?Application Programming Interface
What does each word mean?
Your progra
m
Reusable
Program Library
API
How to Use the Maps API?Load the Google API: it’s for JavaScript
<script src="http://maps.googleapis.com/maps/api/js"></script>
Set Map PropertiesCreate a Map Container: a <div> elementCreate a Map ObjectAdd an Event Listener to Load the Map
Passing Data to a Mashup AppMOM: mercury concentration contour
overlayhttp://theochem.mercer.edu/mapvis
JSON: JavaScript Object NotationDatabase accessibility