Overview

KML (Keyhole Markup Language), an XML schema originally developed for Google Earth to describe shapes on a map has been supported by VE since version 6.0 was released and has remain unchanged up to VE 6.2.  The common questions this series will address are "Which KML features does VE support?" and "How do I use these features?" for developers with no KML experience.

KML Quickstart

If you haven't already, take a look at the Interactive SDK (http://dev.live.com/virtualearth/sdk/ ) and MSDN (http://msdn.microsoft.com/en-us/library/bb429606.aspx ) on to see how to load a feed into VE. I had trouble loading KML locally (GeoRSS was okay) using any browser even with a website setup through IIS.  I found that uploading my KML file to SkyDrive and referencing the URL worked.  Finally, you'll need to open the google KML documentation page (http://code.google.com/apis/kml/documentation/kmlreference.html) to follow along.

Here is a sample KML loader taken from the SDK with a few modifications:

Welcome to the first part in series that takes you through the core functionality of the Microsoft’s Virtual Earth JavaScript control. Through example code I hope to either introduce you to the Virtual Earth control or show you how to do things better and highlight some things you may not have known. I will be making use of the jQuery JavaScript library to provide valuable helper functions and simplify our code. If you feel there is something that could done better please share your ideas in the comments below.

Lets start by loading the Virtual Earth map on a page. Sounds trivial? Well it is, but lets do it as if you were building a real world application and include:

• Browser detection to only load the map for supported browsers
• Binding to the body onload method programmatically as you may not have access to the actual HTML tag
• Dispose the map when you are done
• Load the Virtual Earth JavaScript after the page has loaded to make things load fast
• Have a onLoadedMap method where you can add your data once the map has loaded
• Put your code and styles in external files from the HTML page itself

The Virtual Earth JavaScript control is not small weighing in at 217KB when compressed in Version 6.2. When you require the rich experience of Virtual Earth this size is not an issue, the control is aimed at broadband users and within a few moments of interacting with the map you can easy exceed this with the rich imagery being loaded on demand. But what if your web page only needs to show the Virtual Earth map when a user asks for it or you just want your page to load super fast? You need to load Virtual Earth on demand.

See an example here: http://www.soulsolutions.com.au/examples/VE62/loadondemand.htm (view source for full code)

The Virtual Earth JavaScript control has supported tile overlays for some time. A tile layer is set of 256px square images matching the Mercator projection of Virtual Earth. Tile layers are usually layered on top of Virtual Earth, the control supports transparency and an opacity of the entire layer. With the latest release of Version 6.2 of the control you can now disable the base tile layers allowing for greater performance when your tiles are all you need. Lets look at what is required to load OpenStreetMap tiles into Virtual Earth.

VEWS was just released and after a few attempts myself to get it working I thought I would share a short video on the sign up process and adding the references to Visual Studio 2008.

Video after the break:

Angus and dev.live.com announced on the 28th July 2008 that the July refresh of the Windows Live Tools would include the release of the much anticipated Virtual Earth ASP.NET control.

The control is a complete drag and drop experience from within Visual Studio 2008. Drag the map from your toolbox onto your design surface and resize to suit. As you would expect all Virtual Earth 6.1 properties can be set as properties of the control, there are a full set of server side and client side events for the map and a range of very cool client side extenders.

Through a series of videos we take you through the full experience of installing the control and coding with its basic features. Each video is fairly detailed and runs for about 5-7min. They are hosted by Silverlight Streaming so you will need to install the latest Beta2 Silverlight Client or download the wmv file directly.

Through the videos I hope to not only guide you through how I saw the control being used when I designed it but also share some tips and insights. The videos where recorded at 1024x768px @ 30fps and rescaled for this presentation. Every single sample shown can be downloaded as part of a single package that is also hosted online. It is my hope this sample will grow in time to include some complex examples. Your feedback is welcome.

Videos after the jump

In this article I will show you how to use a combination of free tools and services to produce and host a high quality panorama. You will render this using Silverlight2 and display it geo-referenced on Virtual Earth. The combination of hosted storage and services from Windows Live gives us a powerful Rich Internet Application from a basic HTML page. The tools and services you will use are:

• Your digital camera
• Windows Live Photo Gallery
• Deep Zoom Composer
• Silverlight2
• Silverlight Streaming
• Virtual Earth

The final result below is made from eight photos taken of the Story Bridge in Brisbane, Australia at 6am.

Welcome back to the third part of our deep dive in the Windows Live Quick Apps Website featuring the Contoso Bicycle Club. In this part we’ll take apart one of the main JavaScript function calls that this web site uses, updatePage.

This is the main routine in the application and the one that controls the content for the main area of screen.

Welcome back to the second part of our deep dive in the Windows Live Quick Apps Website featuring the Contoso Bicycle Club. In this part we’ll take a look at another custom user control found on the home page, the Latest Rides feed.

This control is like the previous control we took apart in the first part of the deep dive, but with some changes to that manifest themselves into what looks like a completely different control.

The Contoso Bicycle Club is a demonstration website put together to show off a number of Windows Live technologies and how easy it is to integrate these technologies into your own websites. The source code for both this web site and a second web site entitled Contoso University are available for download from CodePlex.

One note before we proceed any further. Both of these websites are written to run with Visual Studio Orcas (Beta 2 and above). Both applications also use Asp.Net Ajax and the Contoso Bicycle Club also requires the Asp.Net Ajax Toolkit. Both Asp.Net Ajax, the Toolkit and also Asp.Net Ajax Futures are freely downloadable from here.

In this deep dive series, we will take apart the web application and explain in detail exactly how it was put together.

If you want to get a start with some of the Windows Live SDKs, then it can be a daunting task. You could try looking for tutorials on the chosen SDK, or look at the examples that usually come with the SDK package. But with two of them you are actually provided with an interactive SDK that you can use and create your own code based on what you put choose. At the moment there are only two interactive SDKs, and they are provided for Live Search and Virtual Earth. Each one has its own advantages for usage, Live Search is a great starting point for your C# project, whether it be an ASP.NET project or a WinForms project; the Virtual Earth one is good for even the most basic of users, as it has the ability to let you put the code simply into a webpage and can easily give you, for example, a "Where are we" sort of page for your website.