Course info
Sep 8, 2014
1h 55m

This course introduces beginning to intermediate JavaScript developers to the Google Maps API, a powerful library that enables developers to harness the power of the Google Maps platform and build web mapping applications. The course shows how Google Maps works, how to embed a dynamic map within a web page, set its extent, add and symbolize geometry to display data, and take advantage of web services to add extra functionality to your applications.

About the author
About the author

Mark Lewin is a web developer and technical trainer based in the UK. He specializes in web mapping, geographical information systems (GIS) and Javascript frameworks.

Section Introduction Transcripts
Section Introduction Transcripts

Basic Concepts
Welcome to the second module of the Google Maps API Get Started course. I'm Mark Lewis with Pluralsight. In this module, we're going to get you up and running with the Google Maps API. We'll cover some basic geographical concepts first and then jump right into creating and customizing your first map. We'll start by talking about geography, specifically, what geographical concepts you need to understand as a Google Maps developer. We'll deal with projections and coordinates. Then, I'll tell you what the Google Maps API key is, why you should consider getting one, and show you exactly how to do that. Using our API key, we'll then create the hallowed world of web mapping applications. Just a simple map in a Web page. We'll learn how to reference the Google Maps API in your JavaScript, create a map object, and add it to the page. Then, we'll learn how to set the extent to focus on a specific geographical area, change the base map so that we can alternate between satellite imagery and street data, and then look at the options that are available on the map controls, such as zoom, scale, pan, street view, etc. , and how you can configure these in your application.

Adding Data to the Map
Welcome to the third module of the Google Maps API Get Started course. I'm Mark Lewin with Pluralsight. In this module, we're going to look how to add data to our maps. When it comes to adding data to the map, we really have two options. We can either create the data ourselves programmatically, perhaps in response to some sort of input from the user, or we can take advantage of existing data sources. In Google Maps terminology, the data we add to the map ourselves is called an overlay, and the data we bring in from somewhere else is called a layer. In this module, we're going to have a look at the different types of each starting with overlays. We can't hope to cover every type of data that's available in the Google Maps API in detail, so we'll concentrate on the ones that are directly related to the application we're building and provide a brief summary of the rest. Others, like InfoWindows, we'll cover later in the course. So in the first two parts of this module, we'll look at using overlays to add basic shapes like markers, lines, and polygons, and imagery to our map. Then we'll cover adding external data using KML and GeoRSS Layers and introduce some of the other layer types that are available in the API.

Interacting With the Map
Welcome to the fourth module of the Google Maps API Get Started Course. I'm Mark Lewin with Pluralsight. In this section, we're going to look at how to interact with the map by listening for and responding to events. Events in JavaScript, as in life, are just things that happen. For example, when a user clicks on an HTML button in your web application, that's a button-click event. When a page is finished loading, it sends a message to any interested parties telling them of the fact. That's another event. The Google Maps API distinguishes between events generated by user interaction and those raised internally by Maps API objects. In both cases, you'll need to be able to write code that detects that an event has occurred and responds accordingly. That's what we'll cover in this module. We'll start with a practical demonstration of how events work in JavaScript without reference to the Google Maps API at all, and we'll talk about something called a Closure. Then we'll look at how the Google Maps API exposes events on its objects. So, for example, your user can click on a marker, and your application can execute code to respond to that click. Then we'll look at the events raised by API objects internally when their state changes. And, finally, we'll look at how we can the Google Maps API Event Handling mechanism to conveniently handle DOM events too.

Working With Services
Welcome to the fifth and final module of the Google Maps API Get Started course. I'm Mark Lewin with Pluralsight. In this module, we're going to look at how to bring extra functionality into our web mapping applications by using web services. To start our coverage of working with services, we're going to discuss the Geocoding API, a service provided by Google for looking up addresses. Then we'll cover the routine capabilities of the Directions API. Finally, we'll round up some of the other Google Services, which are available, and discuss using non-Google web services in our applications to create mashups.