GeoSpatial Training Services has released an update to it’s popular Google Maps For Your Apps! e-learning course. This course is designed to enable you to take advantage of Google Maps for your website. You will learn how to create maps, add map controls for user interactions (zooming, and panning), programmatically alter the map extent, add points of interest to the map, add custom icons, geocode addresses on the fly, read addresses from a database or XML file, display aerial photography, import KML files to the Google Maps display, integrate the new Google Earth API for 3D display of GMaps data in a web browser, and integrate local search.

Summary of New Content:

• Integration with the new Google Earth API for embedding Google Earth in a browser application
• Import KML files into Google Maps with the GGeoXML class
• Driving Directions, Traffic Conditions, and Street View
• Integration of Google Local Search into Google Maps applications
• An 8 step exercise designed to reinforce the concepts you learn in the lecture portion of the class

Course Modules:

• Module 1: Introduction to Google Maps
• Module 2: Google Maps Programming Basics
• Geocoding with the Google Maps API
• Reading XML Files (including KML) and Databases
• Traffic Conditions, Driving Directions, and Street View
• Google Earth Integration
• Local Search

During our 3rd Year Anniversary you can purchase this course for $45/e-delivery or $55/mail delivery. Other Google Maps and Google Earth bundles from GeoSpatial Training Services are available including the following:

• Google Earth and Google Maps Bundle
• Google Maps Developer Bundle
• Google Earth Developer Bundle
• Mastering KML in Google Earth
• Creating Mapplets with Google Gadgets
• Building Web Based Google Earth Applications
• Creating Dynamic Google Earth Applications

I just wanted to share a cool way that you can display your existing KML files inside a Google Maps application using the GGeoXML class from the Maps API. Many organizations have pre-existing KML files that were created for use within Google Earth, and the GGeoXml Maps API class provides a really simple means for also displaying this data in Google Maps as a GOverlay. Although we are specifically using this class to read a KML file in this example it is worth noting that this class can be used to read any XML file.

In this example, we’re displaying an auto-updating KML file containing Global MODIS Hotspots provided by the Fire Information for Resource Management System (FIRMS) at the University of Maryland. FIRMS integrates remote sensing and GIS technologies to deliver global MODIS hotspot/fire locations to natural resource manager and other stakeholders around the world. FIRMS is funded by NASA and builds on Web Fire Mapper, a web mapping interface that displays hotspots/fires detected by the MODIS Rapid Response System and delivers near real-time hotspot/fire information to international users.

FIRMS provides several auto-updating KML files for regions around the world. Any of these files can be loaded into Google Earth. What I’ve done is take the Continental USA KML file which is updated every four hours (as are the other files) and dynamically loaded the file into a simple Google Maps application using the GGeoXML class in the Maps API.

Take a look at this example and then I’ll describe how this is done within Google Maps.

From a code standpoint, the Maps API makes this a really easy task which can be done with only a few lines of code. To see the full code for this simple Maps application you can simply right click the web page and click View –> Source. I’ve posted the relevant code below. The initialize function is called when the web page loads. We create a new instance of the GGeoXML class and pass in a parameter to the constructor which contains a pointer to a KML file located on a remote web server. In this case we’re pointing to the Continental USA KML file located on the FIRMS web server. Once we’ve created an instance of GGeoXML we then add it to the map using the addOverlay( ) method on the GMap2 class. In between we have some additional Maps API code which creates the underlying map, centers the map, and adds the map controls.

As you can see, using the GGeoXML class to add pre-existing KML files to your Google Maps application is quite simple and very useful. Even the descriptive balloons contained within the KML file have been ported to info windows in Google Earth. Click one of the fire locations to return specific information about a particular fire.

For more information on the Google Maps API or GeoSpatial Training Services please see our e-learning course entitled “Google Maps For Your Apps” or our “Google Maps Developer Bundle” which is currently on sale as part of our 3rd Year Anniversary Sale.

Introduction
In recent years there has been a large movement towards e-learning in many industries, and GIS is no exception. Although computers will never completely eliminate the need and desire for human interaction between instructor and student, the many benefits it offers far outweigh the limitations of the medium. In this post we will examine the benefits, drawbacks, availability, and types of e-learning currently available to GIS professionals.

Features Unique to E-Learning
Knowing a little bit about learning styles can help you determine if e-learning is for you. The interaction and delivery methods used in online classes are dramatically different from traditional classes, so understanding how you learn is a good part of the decision-making process. The three predominant learning styles are visual, auditory, and tactile/kinesthetic. Visual and auditory learning styles fall into the category of passive learning modes while the tactile/kinesthetic learning style is an active learning mode. An active learning mode implies that learning is accomplished by doing or practicing a task and/or speaking about what we learn. Most people tend to fall into this category. However, some people learn best through a passive learning mode which is done through seeing and reading.

Like no other training form, e-learning promises to provide a single experience that accommodates the three distinct learning styles of auditory learners, visual learners, and kinesthetic learners. Other advantages created by the advent and development of e-learning are more efficient training of a globally dispersed audience; reduced publishing and distribution costs as Web-based training becomes a standard; and decreased costs of training from a travel and training materials standpoint.

E-learning also offers individualized instruction, which print media cannot provide, and instructor-led courses allow clumsily and at great cost. In conjunction with assessing needs, e-learning can target specific needs. And by using learning style tests, e-learning can locate and target individual learning preferences.

Additionally, synchronous e-learning is self-paced. Advanced learners are allowed to speed through or bypass instruction that is redundant while novices slow their own progress through content, eliminating frustration with themselves, their fellow learners, and the course.

In these ways, e-learning is inclusive of a maximum number of participants with a maximum range of learning styles, preferences, and needs.

Benefits
Some of the advantages to the learner include:

• Reduced cost
  This is the single most influential factor in adopting e-learning. The elimination of costs associated with student travel, lodging, and meals are directly quantifiable. With the cost of gasoline now reaching over $4.00/gallon and airfare costs increasing weekly this adds up to big savings. The reduction of time spent away from the job by employees may be the most positive offshoot.
• Learning times reduced
  An average of 40 to 60 percent, as found by Brandon Hall (Web-based Training Cookbook, 1997, p. 108).
• Increased retention
  Retention averages an increase of 25 percent over traditional methods, according to an independent study by J.D. Fletcher (Multimedia Review, Spring 1991, pp.33-42).
• On-demand availability
  Enables students to complete training conveniently at off-hours or from home.
• Self-pacing
  For slow or quick learners reduces stress and increases satisfaction.
• Interactivity
  Engages users, pushing them rather than pulling them through training.
• Confidence
  Responsibility of mastery is reduced since materials are available as a refresher or quick reference materials.

Drawbacks
The ways in which e-learning may not excel over other training include:

• Technology issues
  Some learners are fearful or intimidated by technology or the technology is unavailable for use.
• Portability
  E-Learning is not as portable as printed workbooks or reference material, but the limitations of portability have been greatly reduced through wireless connections, network links, notebook computers, PDAs and mobile phones.
• Reduced interaction
  Social and cultural interaction can be a drawback. The impersonality, suppression of communication mechanisms such as body language, and elimination of peer-to-peer learning that are part of this potential disadvantage are lessening with advances in communications technologies.

Types of E-Learning and Delivery Methods
E-learning takes many forms including the following:

• Web based (Blackboard, Moodle, WebCT)
• Computer-based (CD-ROM)
• Blended learning – combination of online and face to face
• Video/audio
• Blogs, Chat, and Discussion Forums
• Hard-copy Workbooks
• Videoconferencing and/or Teleconferencing

It is not uncommon for more than one of these delivery formats to be used in the same course of study to supplement the learning experience.

Availability of GIS E-Learning Opportunities
A number of GIS e-learning opportunities exist from commercial and academic institutions. We don’t have room in this article to highlight all the available distance learning programs offered by colleges and universities so we have highlighted a few of the better known options.

Non-Academic

• GeoSpatial Training Services
  Our company, GeoSpatial Training Services, provides both web-based and computer-based e-learning opportunities focusing primarily on Google Earth, Google Maps, and ESRI technologies.
• ESRI Virtual Campus
  The ESRI Virtual Campus hosts a number of self study courses through their virtual campus.
• New Urban Research
  New Urban Research offers twelve advanced topic ArcGIS Tele-Classes.

University Distance Learning Programs

• UNIGIS International
  UNIGIS is a worldwide network of educational institutions which offer distance learning courses in GIS. Institutions within the UNIGIS network offer internationally recognized qualifications for GIS professionals and those seeking to enter the field.
• Penn State University
  Penn State offers a Masters Degree in GIS through their World Campus program.
• Institute for Advanced Education in Geospatial Sciences
  IAEGS was established as a collaborative course development center, based at the University of Mississippi in Oxford, Mississippi and hosts a number of courses on topics such as remote sensing, photogrammetry and digital image processing, and other geospatial technology topics.
• University of Southern California
  USC offers both a Master of Science + Technology degree along with a GIST certificate program.
• Elmhurst College
• University of Denver

GeoSpatial Training Services: Our Approach to GIS E-Learning
At GeoSpatial Training Services, we focus on the development of Internet based and computer based (CD-ROM) courses for the geospatial industry and we focus heavily on Google Earth, Google Maps, and ESRI technologies. Through our Virtual GIS Classroom we offer Internet based courses such as “GIS Programming 101: Mastering Python for Geoprocessing in ArcGIS” and will soon have additional offerings. In addition, we offer a wide array of computer based GIS training options available by e-delivery (download) or traditional via traditional CD-ROM. Furthermore, we develop custom training solutions for geospatial custom off-the shelf products (COTS) and organizations and conversion of instructor led training materials to various e-learning formats.

The <Camera> element, new to KML 2.2, provides a way to define your observer’s viewpoint in terms of position and viewing direction, and is a child element of any <Feature>.  Features can include Placemark, NetworkLink, Folder, Document, PhotoOverlay, ScreenOverlay, and GroundOverlay.  In previous KML versions (2.1 and earlier) a similar element, <LookAt> was used to define the placement and orientation of the camera. 

Differences Between <Camera> and <LookAt>
Let’s take a look at these two elements to determine how they differ.

As you can see from these figures the two elements look quite similar, but they have some fundamental differences.  Let’s start with the <longitude> and <latitude> child elements.  In <LookAt>, these elements refer to the point the camera is looking at, whereas in <Camera> these elements refer to the virtual camera (eye point).  This is an important distinction.  <LookAt> specifies the view in terms of the point of interest while <Camera> specifies the view in terms of the viewer’s position and orientation.  Similarly, the <altitude> element refers to the altitude of the point of interest for <LookAt> whereas it refers to the distance of the camera from the earth’s surface for <Camera>. 

There are some additional differences between the two elements.  For instance, <LookAt> contains a <range> child element that specifies the distance in meters from the point of interest specified by <longitude>, <latitude>, and <altitude> to the LookAt position.  The <Camera> element does not contain this particular element.  In addition, the <Camera> element also provides additional functionality for controlling the tilt of the camera view.  The <tilt> element in <Camera> can be any value between 0 and 180 which gives you the ability to tilt the camera above the horizon into the sky, whereas in <LookAt> you are limited to a value between 0 and 90.  In either element, a value of 0 indicates that viewing is from directly above, while a value of 90 indicates viewing along the horizon.  Because <LookAt> can contain only values between 0 and 90 you are limited to viewing from directly above through a horizontal view.  As I mentioned above, the <tilt> values for <Camera> can range from 0 to 180 with values greater than 90 indicating a view that is pointed above the horizon toward the sky.  Finally, the <roll> element on Camera gives you the ability to rotate the camera around the Z axis and can contain any value between -180 and +180 degrees.

Examples
Now we’ll take a look at a few examples that illustrate different <Camera> settings taken from the San Diego Convention Center and Petco Park.  You can download the file containing all examples here.  You’ll want to make sure you turn on the 3D buildings in the Google Earth layers panel before opening the file.

Heading
This first example shows a <Camera> with a heading of 90 degree (East) and a tilt of 90 degrees (toward horizon).  Remember that headings can be any value between 0 (north) and 360.  The default is 0 or north.  The Camera in this case is placed at an altitude of 100 meters. 

Tilt
In the next example, we set the <tilt> value to 0 which will set the camera to look straight down toward the earth.  We’re also setting the <heading> to north and the <altitude> to 500 meters.

 Now let’s try something a little different.  In this next example, we’re going to take a look inside Petco Park from the viewpoint of a major league baseball platter in the batter’s box.  In this case we are setting the <tilt> to 110 which points slightly up into the sky.  We’re also setting the altitude to slightly above sea level.

Roll
Finally, we’ll examine the <roll> element which rotates the camera around the Z axis with values ranging from -180 to +180.  Sticking with our Petco Park example, assume that the pitcher has thrown a wild pitch and hit the batter!  The batter has subsequently fall down.  Ouch!  Using the <roll> element with a value of 45 which will roll the camera to the left we can simulate the viewpoint of the batter who is now lying on the ground.

 Hopefully these examples have helped illustrate how you can use the Google Earth <Camera> element to control the user viewport and using your imagination you can come up with some creative ways to use these features in your analysis of geographic data.

More Information
For detailed information about KML, Google Earth, or Google Maps please see the following e-learning courses provided by GeoSpatial Training Services.

• Mastering KML in Google Earth
• Dynamic Google Earth Applications
• Google Maps For Your Apps
• Google Earth for ArcGIS Users
  

During the month of May you can get $20.00 off our Google Maps and Google Earth Bundle by entering the discount code SAVEONBUNDLE when purchasing through our website.

Find GIS is a new, comprehensive GIS Data Resource website concentrated within the State of Florida. For full details about the site, please see the welcome message at the top of the home page at www.findgis.com.

The Find GIS site is the top privately owned GIS resource in the State of Florida and includes GIS Sources, GIS Contacts, Data Download Sites, FTP Sites for all 67 Counties and all 418 Incorporated Areas (Cities, Towns, Villages, etc.) where available in the state. Links for the GIS divisions of multiple government agencies within the state including all 7 FDOT Districts, 11 Regional Planning Councils, and 5 Water Management Districts are also included.

Find GIS has recently been selected as the Local Media Sponsor for the Geospatial Information & Technology Association’s (GITA) (www.gita.org) upcoming 2009 Geospatial Infrastructure Solutions Conference (www.gita.org/gis/). Please feel free to let us know if your company or organization would like to market any future geospatial conference, expo, meeting, webinar, or workshop to GIS industry professionals throughout Florida and the Southeastern U.S. market area.

 Also keep in mind that The Florida GIS Data News Feed is the official RSS feed for Find GIS. The news feed now has over 14,000 subscribers, so please feel free to notify us if you have any GIS related press releases, case studies, news, projects, or events you would like posted at any time in the future.

There are now multiple advertising opportunities available on the site including “Market Where You Map” Ads sold for a flat annual fee and “Direct Online Ad Placements” sold in blocks of 1,000 impressions in a CPM (cost per thousand) rate basis. Either type of advertisement is a great way to get your company name out there and reach potential customers throughout our market area.

 For your reference purposes, the Find GIS site has recently been featured in Globe Street, the Florida Real Estate Journal, and The GeoFactor. Please review the articles at the provided links below.

Globe Street
http://www.globest.com/news/1119_1119/insider/169448-1.html?sector=technology

Florida Real Estate Journal
http://www.frej.net/news/templates/content.aspx?articleid=18213&zoneid=7

 The GeoFactor
http://www.thegeofactor.com/2007/12/14/gis-finds-the-sunshine-in-florida/

 For any further inquiries about Find GIS, please contact a company representative today at (561) 935-4909.

In this post I’m going to cover the topic of creating compelling Google Earth description balloons for your placemarks. These descriptive balloons are a fantastic way of communicating information to your users, and can include HTML, text, images, videos, hyperlinks, and pretty much anything else that you would like to portray to users. Because of the diversity of content that can be included in a description balloon, they tend to make excellent teaching tools, and have been used as such by National Geographic, Greenpeace, Global Heritage Fund, Earthwatch, and many others.

KML for Balloons
We’ll start with some basic information about how these balloons are created in KML. Descriptive balloons are attached to Placemarks in Google Earth, and are displayed when clicked. The creation of a description balloon for a placemark is accomplished with the use of the <BalloonStyle> KML element. A <BalloonStyle> is a ‘type of’ or child of the <Style> element so it is common practice to define a balloon style within the context of a <Style>. Therefore, you could have something like this:

Notice that we are assigning an id of ‘sn_ywl-blank’ to the <Style> element. This is just a descriptive name that we’ll user later to refer back to this content. Inside <Style> we have our <BalloonStyle> element which contains the details of our balloon. For simplicity, we are only using the <text> element in this case. Now let’s cover the details of what can be included inside <BalloonStyle>.

The <BalloonStyle> element has a number of child elements that are used to control the content and display characteristics of the items including in our descriptive balloon. The background color <bgColor>, text color <textColor>, text <text>, and display mode <displayMode> can be used within <BalloonStyle>. The background color and text color elements are self explanatory, but the <text> element in particular deserves more attention.

The <text> element contains the content that will be displayed in the balloon. In the event that you do not specify any text, Google Earth will draw a default balloon with the feature name, feature description, links for driving directions, a white background, and a tail that is attached to the point coordinates of the feature. But we’re really not interested in the default behavior since we are pursuing the creation of informative, compelling description balloons.

Inside the <text> element you can embed HTML along with various entities that are used refer to a child element of the placemark. These entities include $[name], $[description], $[address], $[id], $[Snippet], and $[geDirections]. An example is in order here to more clearly explain this. In the code example below you’ll notice that the <text> element contains a $[description] entity.

What this means is that the description contained within the <description> element of a placemark will be substituted in this place and thus allowing for unique content associated with each placemark. This description can contain HTML, hyperlinks, images, and videos.

For example, in the image below I’ve right clicked on a placemark and selected Properties. The Description tab displays the content of the <description> tag inside a placemark. Click here to see the actual file. What you’re looking for is the <description> tag inside the <Placemark> element. You should also look for the <styleUrl> element toward the bottom of the file. This element contains the text ‘#sn_ylw-blank’ which is used to point back to the <Style> element that we defined earlier.

As I mentioned above, there are a number of other entities that you can add to the <text> element. The same concept applies for these entities. Each of these entities can be used to obtain the information stored in the corresponding element found on the placemark.

One other point should be made here. When embedding HTML inside the <text> element you can use a CDATA section to ensure that the parser will ignore your markup characters. Between the start and end of a CDATA section, all character data is passed directly to the application without interpretation as you can see in the example below.

Templates
At this point we’ve covered the basic elements that you’ll use to create descriptive balloons. However, if you’re like me and have little to no graphic design skills you’re probably wondering how to go about creating attractive content for your balloons. Fortunately, Google has provided a number of templates that we can use as a starting point. You can make copies from these templates and then add in your own text, images, and other content.

You can’t update the content of your description balloons in Google Earth so you’ll need to use a text editor or an HTML editor such as Dreamweaver or NVU. You can copy the HTML from the templates into your favorite editor, edit the content as necessary, and then replace the existing template code.

Other Cool Stuff – Adding YouTube Videos
In addition to being able to customize your description balloons by adding text, images, and hyperlinks you can also embed a YouTube video into your balloon. This Google Outreach tutorial will walk you through the process of adding YouTube videos to your descriptive placemark balloons.

Examples
The Global Awareness folder inside the Layer panel contains many examples of compelling placemark balloons that you can use as a guide when you begin developing your own content.

More Information
For detailed information about KML, Google Earth, or Google Maps please see the following e-learning courses provided by GeoSpatial Training Services.

Mastering KML in Google Earth
Dynamic Google Earth Applications
Google Maps for Your Apps!
Google Earth for ArcGIS Users

During the month of May you can get $20.00 off our Google Maps and Google Earth Bundle by entering the discount code SAVEONBUNDLE when purchasing through our website.

I’m cleaning out my library again and have some free books for anyone that is interested. All you have to do is pay for the shipping costs. Contact me at eric@geospatialtraining.com to let me know which books you’d like. Limit 2 please and I’m only shipping within the U.S.

Professional C#: 2nd Edition
Programming ASP.NET
Upgrading Visual Basic 6.0 to Visual Basic .NET
Active Server Pages 3.0
An Introduction to Database Systems
Project Management Best Practices for IT Professionals
Project Management Professional Study Guide
A Guide to the Project Management Body of Knowledge
Programming with Avenue
ArcView Developers Guide
ArcView/Avenue Programmer’s Reference

In our last post we introduced the new Google Maps API Street View objects which give developers the ability to enable Flash based street visualizations in select U.S. cities.  I described the functionality provided by the Street View objects as well as the capabilities of each object.  Finally, we took a look at a simple code sample that shows you how to use these objects to create a Street View Flash viewer. 

In this post we will examine how you can control the orientation of the Street View Flash viewer through the GPov class.  As we discussed last time, a Street View image consists of both a location, specified by a GLatLng object, as well as a particular orientation.  The orientation is specified through the GPov class.  Used together, these two parameters are used to construct the initial Street View object. 

Let’s examine the GPov class in greater detail.  GPov is an object literal which simply means that you do not create individual instances of a GPov through either a constructor or via other objects.  You simply use the properties and/or methods that are available to the literal class.  Let’s take a look at a code example to illustrate this point.

Example: Setting the GPov properties
myPOV = { yaw:90.00, pitch:-20, zoom:30 }

Properties of GPov
GPov has three optional properties that you can set, each of which are numeric values.

yaw – The camera yaw in degrees relative to true north.  True north is 0 degrees, east is 90 degrees, south is 180 degrees, and west is 270 degrees. 

pitch – The camera pitch in degrees, relative to the street view vehicle.  Values can range from 90 degrees (directly upwards) to -90 degrees (directly downwards)

zoom – The zoom level with 0 being fully zoomed-out, and values increased from there.

Note that I said all these parameters are optional.  In the event that you choose not to define any properties for GPov, they each default to 0 which defines a flat horizontal view directly north with the widest possible view.

Applying GPov to Street View
Once you’ve defined the parameters for GPov you will need to assign it to a GStreetviewPanorama object for the settings to take effect.  This can be done in two ways.  The first method is to assign GPov to an instance of GStreetviewPanoramaOptions which is then used in the constructor for GStreetviewPanorama.  Let’s take a closer look at how this is accomplished.  GStreetviewPanoramaOptions, like GPov, is an object literal.  This object literal has two properties that can be set: an instance of GLatLng, and an instance of GPov.  A code example can help reinforce this concept.

Example: Setting the GStreetviewPanoramaOptions properties and then using it in the constructor for GStreetviewPanorama
panoramaOptions = {  latlng:theAlamo, pov:myPOV }
myPano = new GStreetviewPanorama(document.getElementById(”pano”), panoramaOptions)

Click here to see the example in a web page.  Notice that we have set the yaw parameter to 90 which sets the direction to east.

The second method of assigning GPov to an instance of GStreetviewPanorama is through the setLocationAndPOV( ) method available on GStreetviewPanorama.  The setLocationAndPOV( ) method can be used to set the POV after an instance of GStreetviewPanorama has been created.  Once again, a code example is helpful to reinforce this concept. 

Example: Setting the POV through setLocationAndPOV
myPano = new GStreetviewPanorama(document.getElementById(”pano”));
var theAlamo = new GLatLng(29.425849,-98.486927);
myPOV = {yaw:90}myPano.setLocationAndPOV(theAlamo,myPOV) 

Many Google Maps developers have been eagerly awaiting the inclusion of objects for controlling Street Views from the Google Maps API, and last week it became official!  A handful of new objects including GStreetviewPanorama, GStreetviewOverlay, GStreetviewClient, and GStreetviewLocation among others have been added to the Google Maps API that allow developers to include these Flash enabled street visualizations. 

What is StreetView?
For those of you who are not familiar with Google Maps Street View let me do a quick review.  In certain large metropolitan areas of the U.S. you can view and navigate within Google Maps via street-level imagery.  You’ll notice that when you go to the main Google Maps page a new button called Street View has been added to the display.

Clicking the Street View button will display a Camera for each city that has the capability of displaying Street Views.  You can click on an individual camera to zoom to your city of interest.

Streets that are capable of displaying a Street View will be outlined in blue and you will also see a human icon that can be used to display a Street View.  You can simply drag the icon onto the street you’d like to display or simply click on a street with your mouse.

This street-level imagery is provided through a Flash plugin so you should make sure that you have installed the latest version of Flash for your browser.  You’ll notice that a number of navigation and display controls are embedded in the Street View. 

Navigating the streets
Each street is labeled and contains arrows indicating direction.  You can click these arrows to navigate further in that direction. 

Zooming
There are a number of methods that you can use to control zooming in and out on the image.  Double-clicking the image, using your mouse wheel, or using the zoom control can all be used to zoom in on the image.  Once you’ve zoomed in a ‘Zoom Out’ button will then be provided or you can use the mouse wheel or zoom control to move back out on the image. 

Panning
Panning is accomplished either by dragging the image in the direction in which you’d like to pan or by clicking the pan buttons.  You can even tilt the image to see the sky or ground by dragging the mouse up or down. 

You can also use the arrow keys on your keyboard to control navigation along the street and to pan the image display.

New Classes in the Google Maps API
Let’s do a quick overview of the new classes for controlling Street View that have been added to the Google Maps API. 

GStreetviewPanorama – Holds an instance of the Flash® Street View Panorama viewer.  Normally embedded within a container object such as <div> and can be manipulated through its methods.

GStreetviewPanoramaOptions – Represents options that can be passed to the GStreetviewPanorama constructor.

GStreetviewOverlay – Tileset highlighting locations where Street View data is available.

 GStreetviewClient – Performs searches for Street View data based on parameters passed to its method.

GStreetviewData – Represents the data associated with a panorama.

GStreetviewLocation – Represents a street view location.

GStreetviewLink – Represents a link from one GStreetviewLocation to a neighboring GStreetviewLocation.

GPov – Repreesents the structure of a camera point of view used by street view.

A Simple Example
I’m going to do a series of posts that show you how to use these classes in your Google Maps application.  In this post we’ll start with a simple example.  Click here to see our first example and you can display the code for this example by right clicking the page and selecting View Source.  If you’ll click the right pan button twice you should see the Alamo in San Antonio, Texas.  Let’s review the code.

The new Street View classes that have been added to the Google Maps API are accessible through JavaScript just the same as any other class in the API.  Let’s first review the a line of HTML code near the bottom of the file. 

The <div> tag is used as a container for the Street View and you will need to assign an id to the div along with a height and width for the container.  Notice that we have assigned a value of ‘pano’ as our id.  You’ll see this value again inside the JavaScript when we assign our StreetViewPanorama to this container.  You’ll also notice in the code above that we have defined a JavaScript function that will be called in response to the onload event.  In this case, the initialize() function will be called when the page loads.  So, let’s take a look at the initialize() function since this is where we create our Street View.

Just above the initialize() function you’ll notice that we’ve declared a variable called myPano which will store the Street View Panorama that is created.  Inside the function we create a new GLatLng object from a pair of coordinates and store this object in a variable called theAlamo.  This value is then used in the panoramaOptions variable which will be passed into the constructor for GStreetviewPanorama in the next line.  Remember that we said the GStreetviewPanorama object holds an instance of the Flash® Street View Panorama viewer.  It is the primary object used for the Street Views in Google Maps.  The supporting GStreetviewPanoramaOptions is used in the constuctor for GStreetviewPanorama and defines various options that are used to control the display and functionality of the viewer.  In this case we’re only passing in a latitude/longitude coordinate value, but you can also pass in a GPov object that controls the camera orientation with which to open the Flash viewer.  The other parameter in the GStreetviewPanorama constructor controls where the Street View will appear.   This is where the <div> tag that we created in the HTML body comes into play.  When we pass in document.getElementById(”pano”) to the constuctor we are specifically stating that the Street View should be placed in this <div> tag container.  Finally, we add in an event listener for the Street View so that it can report browsers that are unable to support the Flash plugin. 

This was a very simple example that demonstrates how you can use the new Street View classes in the Google Maps API to add in Street Views to your Google Maps application.  In our new few posts we will take a look at more advanced Street View code examples. 

For more information on the Google Maps API please see our popular e-learning course “Google Maps For Your Apps!“.  This course has been in production since January 2006 and has been our best selling course since that time.  During the month of April you can save $15.00 on this course by entering a discount code of GISDiscount when purchasing this course through our website. 

This discount also applies to our “Google Earth and Google Maps Bundle” e-learning set which contains Google Maps For Your Apps along with several other Google Earth courses.