How to: Use the Contact Map Sample

The Microsoft Office Live Contact Map sample code is designed to show one way that you can use Office Live Small Business Web services to create a mashup that extends the functionality of an Office Live Small Business application. This mashup takes advantage of the Microsoft Virtual Earth platform, which is a mapping and location service.

The Contact Map sample, which uses Business Contact Manager, creates a map control that allows you to display the location of contacts from the Business Contact Manager Contacts list on a map provided by Virtual Earth.

The code included in the Contact Map sample includes a common JScript file called olsharedlibv1.js. This file contains the JScript functions to package the SOAP requests you need to talk to Office Live Small Business Web services.

Look at the End Result

The best way to understand the functionality provided by this sample code is to install it on an Office Live Small Business application. The download is an executable file that contains a combination of files. One of these files is a sample page that contains a Web Part that displays the map, so that you can quickly see the results of the code. To download and install the Contact Map sample code, do the following:

  1. Go to the Microsoft Download Center.
  2. Click OfficeLiveContactMap.exe to install the Contact Map files to the following location: C:\Microsoft Office Live Developer Resources\Contact Map Sample.
  3. Upload the files to a document library in a business application. For example, you can upload the files to the Business Documents library of Business Contact Manager.
  4. In the library, click samplepage.

The Sample Web page opens, with a Page Viewer Web Part that displays the Contact Map. The right side of this Web Part includes a check box for each of the contacts from Business Contact Manager that specify a business address. Select the check box beside each of the contacts that you want to appear on the map and a pushpin appears at that contact’s address.

How It Works

There are several functions in the maps JScript file that combine to make this mashup, including functions to set up a map, add contacts to the map, and remove contacts from a map.

Set Up a Map

The getMap function initializes a Virtual Earth Map (VEMap) object.

Get Contacts

The getContacts function uses the Microsoft Windows SharePoint Services 3.0 Web service to get the list of contacts from the specified context. In this sample, the context is Business Contact Manager. This code is a reference you can use to model calls to the Windows SharePoint Services Web services that are hosted by Office Live Small Business. These services give you access to the lists in the various business applications, such as the Contacts list used in this example. You can read data from the list, insert, update and delete records, and much more.

Add and Remove Contacts on the Map

When the Contact Map page is first loaded, this sample code retrieves the contacts that include address information by using Windows SharePoint Services 3.0 Web services. Each contact is cached as an object in the browser’s memory. When the addContactToMap function is called, the address information from the contact object of the selected contact is passed into the Virtual Earth API to add a pushpin on the map in the right location. The Virtual Earth pushpin object is then cached into this contact object.

When you cancel the selection of a contact, the removeContactFromWeb function calls back to the Virtual Earth API and passes the object to remove the pushpin.