Virtual Earth and the Windows Live CTP

Virtual Earth Map

From a developer’s perspective, Virtual Earth is hands down my favorite online mapping tool, bar none. I’ve worked with Virtual Earth for quite a while now, and though it was perfectly manageable via 100% clientside code as originally developed; the new ASP.NET controls provided in the Windows Live CTP is a fantastic addition.

Simplification of this tool is almost too good. Part of me worries that my once (more) novel idea of providing an online tool for logging fishing trips may have a few less barriers to reproduce simply by the release of this great tool.

Hello World of Virtual Earth

After installing the Windows Live CTP (November 2008 release here), open Microsoft Visual Studio (or Express), create a new ASP.NET 3.5 project and look for the newly added template called Windows Live Project.

This project adds the necessary setup and references to the Virtual Earth controls as well as some additional controls found in this packet.

To begin working with a map, simply drag and drop the map from the toolbar onto your webpage. At this point you should be able to see the designer view of the map or the following HTML in markup:

<ve:Map ID="Map1" runat="server" Height="400px" Width="400px" ZoomLevel="4" />

That’s it for absolute basics. You have a map. P.S., if not already added, you will need a ScriptManager as well or you may run into a server error.

Adding Pushpins

The Virtual Earth Map uses a collection of shapes which can be added to the map at any time. To add a very basic shape (a pushpin), please examine the following code:

//Add pushpin to map
double lat = 22.12345;
double lng = -81.12345;
LatLongWithAltitude point = new LatLongWithAltitude(lat, lng);
Shape shape = new Shape(ShapeType.Pushpin, point);

Note: I added a using (using Microsoft.Live.ServerControls.VE;) to avoid long namespace declaration, if you have any problem from directly using this code, check your namespaces)

Panning to a Specific Longitude/Latitude

Another basic task is to pan to a specific location. You can do this by the following code:

//Pan to pushpin
map.PanToLatLong(new LatLongWithAltitude(lat, lng));

A Gotcha!

It may be intuitive for others to NOT place the virtual earth control inside an update panel, but I do remember doing this my first go with this control. Please note, I experienced several issues when doing this as the control still runs primarily on clientside code (I believe the .NET controls are really just wrappers for this clientside code – but maybe someone can check that for me), and it flakes when in an update panel.

To Microsoft’s credit, they probably have explicit instructions all over the place regarding this, but since I rarely read documentation thoroughly… well, you know how that goes.

For a Peak at a Ton of Usage in a Realworld App…

Take a gander at for examples of the Virtual Earth control in action. The purpose of this website is to allow angler’s to log their fishing trips, and based on the time and gps it keeps historically record as well as determines the closest source of reliable weather information for the time of the catch(es).

You can sign up for free (no commitment), or if you’re really lazy check out the free demo account!

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s