Silverlight-map integration progress v0.8

TileClient08 is the latest of my efforts to integrate Silverlight with Virtual Earth/Google Maps. The improvements are all focused on the Earth maps (not Moon/Mars for now).

It uses Microsoft Virtual Earth tiles for the 'road' view and Google tiles for the satellite view. The navigation is still a bit clumsy (centering isn't quite there yet), so the best way to give it a try is:

- click one of the city locations (Sydney, New York, London, Tokyo) and navigate around from there (up/down/left/right/in/out)

- click (once!) to set a flag and then zoom in (with the nav-link, or mousewheel). You'll notice the flag/centerpoint "dance around" a bit - just trust that it will try to keep the location in the viewport

- use the Long/Lat/Zoom inputs to go direct to any location on Earth

The slightly odd behaviour is due to the reliance on the tile-grid to lay out the images. Once I have the math worked out to make the grid of images larger (and clipped by) the viewport, it should all work a lot more smoothly. I've also fixed the (previously unknown) IE-bug: you can't treat strings as arrays apparently, so I had to make

quadkey[quadkey.length-1]

into

quadkey.charAt(quadkey.length-1)

for the Virtual Earth tiles to load in IE.

WARNING: I've just noticed (after lots of testing today) that Google's servers will eventually think you're attacking their image server if you download too many tiles too quickly (I wonder if/how Silverlight caches images?).

If you see 'Image not available at this zoom level' always on the earthsat view, Google is probably blocking the images. Click this image link to check - http://kh0.google.com/kh?n=404&v=20&t=tsrrtsqrssqqtts - you'll either see the image, or get a CAPTCHA test... haven't noticed Virtual Earth not serving images (yet...)

WOT: This post was my first using Live Writer... so far so good (although the spacing is a bit whack around the code)

Silverlight, Virtual Earth and Google Moon

Slow progress is being made with tiles from Virtual Earth, Google Moon & Mars, and custom Venus images hosted in a generic Silverlight Map Viewer -- panning kinda works (in addition to zoom)! It's clunky, tile-at-a-time panning (no smooth drag metaphor, yet) but it (mostly) works.

Earth (VirtualEarth tiles)
Moon (Google Maps tiles)
Mars (Google Maps tiles)
Venus (custom tiles)

OK, if you visited the demo you'll know it's not quite done yet... specifically when you zoom in, the zoomed coordinates (row/col) are based on the previous zoom level, so they tend (erroneously) towards the top-left of the map; zooming out sometimes breaks around the edges too... although this is a 'silverlight' project, so far there's only a sprinkling of Xaml - it's mostly math & javascript!

UPDATE: 'earth' view doesn't seem to work in IE. Not sure why... give it a go in Firefox.

Silverlight map control - progress update

Well, the Silverlight map control is coming along slowly...

There has been some progress on calculating the display image tiles, position, etc which is key to enabling proper pan/zoom using - the Moon map now has 'live' coordinate calculations, and very basic up-down-left-right to try.

To get an idea of what the Base4/Binary numbers mean, read about using a Binary Coordinate System and how it is applied in the Virtual Earth tile system (hint: qrts == 0123).

As for the Venus map...

...it doesn't pan yet, but all the images were custom-generated^ using this quadkey map-tile generator. It's only about 100 lines of code, and seems to be limited by the maximum image size
Bitmap resized = new Bitmap(imageSize, imageSize); //16384
All three 'venus maps' were generated using that code.

^ the moon sample currently uses tiles from Google moon.

"Moon"light - Silverlight and moontiles

Turns out the lat-long algorithm works on the moon too!

The Apollo landing co-ordinates on faqs.org were mapped in the Silverlight TileClient straight from JSON...

 
var landings = eval('['
+' {"Name":"Apollo11","Y":0.67, "X":23.49}' 
+',{"Name":"Apollo12","Y":-3.20, "X":-23.38}'
+',{"Name":"Apollo14","Y":-3.67, "X":-17.47}' 
+',{"Name":"Apollo15","Y":26.10, "X":3.65}'
+',{"Name":"Apollo16","Y":-8.99, "X":15.52}'
+',{"Name":"Apollo17","Y":20.16, "X":30.77}' 
+']')

Here are the points, mapped with yesterday's Javascript function CoordinateFromLongLat() and overlaid on the 'real' moon.google.com... 
 
The JSON is injected into the Silverlight Canvas using CreateFromXaml() method,

var plugin = document.getElementById("SilverlightControl");// landings is the JSON arrayvar coord = CoordinateFromLongLat(landings[0], world);var xaml = flagXaml (landings[0].Name, coord.X, coord.Y);var xamlC = plugin.content.createFromXaml(xaml); canvas.children.add(xamlC);

Where the Silverlight plugin was instantiated like this:

Silverlight.createObjectEx({ source: 'TileClient.xaml', parentElement: document.getElementById("SilverlightControlHost"), id:'SilverlightControl', 

I mention that because most of the samples discussing CreateFromSilverlight() expect the call to come from an event handler, where the sender argument has the getHost() method available.


 
UPDATE 28/8: the Silverlight-moontile client now zooms in and out (but no panning yet...)

Lat/Long to pixel conversion (for Silverlight, in Javascript)

Greg Schechter's Silverlight 1.1 VirtualEarth Viewer is a very cool sample (ot: as is tafiti Silverlight search interface, which I just came across today).

However the VirtualEarth Viewer is written for Silverlight 1.1, and I want RaceReplay.net to be able to display & animate maps in Silverlight 1.0. Hence the work on a custom TileClient for Silverlight - the most recent sample of which uses a few lines of Greg's codes (converted from C# to Javascript) to dynamically translate screen coordinates to latitude/longitude values (and vice versa)

See it in action here, and check out the ported code below.

/* Original Author http://blogs.msdn.com/greg_schechter
License http://msdn.microsoft.com/vstudio/eula.aspx?id=c8bf88e7-841c-43fd-c63d-379943617f36 */
function RadiansToDegrees (rad)
{
return (rad / Math.PI * 180.0);
}
function DegreesToRadians (deg)
{
return (deg * Math.PI / 180.0);
}
/* SLVirtualEarthViewer */
// Extent maps to +-180 for Longitude and +-85 for Latitude
function LongLatFromCoordinate (coordinate, worldRect)
{
var x = ((coordinate.X - worldRect.Left) * 360.0 / worldRect.Width) - 180.0;
var y = RadiansToDegrees (2 * Math.atan(Math.exp(Math.PI * (1.0 - 2.0 * (coordinate.Y - worldRect.Top) / worldRect.Height))) - Math.PI * 0.5);
var point = eval('({"X":'+x+', "Y":'+y+'})');
return point;
}
function CoordinateFromLongLat (longLat, worldRect)
{
var coordinate = eval('({"X":0, "Y":0})');
coordinate.X = worldRect.Left + (longLat.X + 180.0) * worldRect.Width / 360.0;
coordinate.Y = worldRect.Top + (worldRect.Width * 0.5) * (1 - (Math.log(Math.tan(DegreesToRadians(longLat.Y) * 0.5 + Math.PI * 0.25))) / Math.PI);
return coordinate;
}

And to use it...

var world = eval('({"Left":0, "Top":0, "Width":512, "Height":512})');
/* wired up to Silverlight event */
function onMouseMove (sender, mouseEventArgs)
{
var currX = mouseEventArgs.getPosition(null).x;
var currY = mouseEventArgs.getPosition(null).y;
var coo = eval('({"Y":'+currY+', "X":'+currX+'})');

var ll= LongLatFromCoordinate(coo, world);
document.getElementById('output').innerHTML = 'Lat/long: ' + ll.X + ', ' + ll.Y;

var coord = CoordinateFromLongLat(ll, world);
document.getElementById('output').innerHTML += '

Screen: ' + coord.X + ', ' + coord.Y;
}

Now to hook this up with a conversion to Virtual Earth image tile 'quadkey' values...

p.s. if you are interested in a slightly different version of the lat/long-coordinate conversion, download the sample code for Roll Your Own Tile Server and examine the XToLongitudeAtZoom() and YToLatitudeAtZoom() javascript functions. It's also a very cool sample.

Silverlight map 'saga' continues

After posting about my Silverlight/Virtual Earth overlay on RaceReplay and my plans for a Silverlight VirtualEarth viewer on codeplex, I got a friendly message from Microsoft about using the Virtual Earth tile servers "outside of the terms of service".

I figured it would be 'more responsible' to ensure that the Tile Client at least supported the Virtual Earth logo & copyright details, so I spent a bit of time working on displaying the correct copyright notice in Silverlight - the goal being that the Silverlight client would be indistinguishable from the "real thing".

Turns out Greg Shechter from Microsoft has come up with a similar concept (it's pretty obvious, after all) - a Virtual Earth Viewer (but using Silverlight 1.1, not 1.0)... (screenshot below)

It's a pretty cool sample - but even he didn't bother with the copyright; and it seems like a double-standard for MS to 'ask' me about accessing the tile images directly while at the same time releasing demo/samples that do exactly the same thing! Particularly since Greg's stuff actually works whereas my posts consist of a 4-tile proof-of-concept and a pile of ideas...

Try doing THIS with javascript-driven maps

OK, I'm still working on getting the tile-grid 'working' beyond a simple 2x2 fixed quadkey BUT that doesn't mean we can't play around with the display capabilities of a Silverlight-hosted map control.

No, there's no business application per-se for randomly animating, zooming and translating the map tiles like this, but it looks cool (view larger image)

[OT] BTW, apparently there are some element names that "just don't work", this being one of them: <Storyboard x:Name="TimelineTranslate" RepeatBehavior="1x">. Had me confused for a minute when a SILVERLIGHT ERROR "TimelineTranslate has no properties" was thrown - but a simple name change and the animation worked.

Virtual Earth custom tile client (in Silverlight)

While RaceReplay.net works "acceptably" overlaying Silverlight and Virtual Earth to visualize animated/map data, it would be even better (smoother, easier to synchronize) if there was a Virtual Earth client in Silverlight, rather like this Flash map client for Yahoo Maps.

So, using tips from these instructions on
rolling your own tile server here is a first attempt at a Silverlight Virtual Earth Tile Client. I could post the source code - but as with all Silverlight 1.0 stuff, it's right there on the page!

The real question is - how much work to get from here to something that actually works?

Map-a-likes: where to map your running routes

Rundown of interactive mapping sites I've come across, primarily for mapping running (or other exercise) track data using either Google Earth or Microsoft Virtual Earth/Live Maps... (no, I haven't seen one using Yahoo Maps yet). Some require you to draw/trace the route, others allow upload of GPX, KML or other GPS-format data.

MapMyFitness
Includes MapMyRun, MapMyRide and MapMyTri. Uses Google Maps to draw routes, enter training data and search for others. Imports Gpx and from gmap-pedometer. Exports to Kmz. 5 star favourite.
www.mapmyfitness.com

Gmap-Pedometer
The original (as far as I'm concerned) - if there was a site around before this one, I didn't find it.
www.gmap-pedometer.com

MotionBased
Focussed on GPS data integration using Google Earth maps - since I don't have any toys, haven't really used it. Apparently has lots of 'analysis' features for your data & fitness.
www.motionbased.com

ShareMyRoutes
Uses Microsoft Virtual Earth. Exports to Gpx and Kml.
www.sharemyroutes.com

CompareTracks
Not so much a website, but a piece of software to manage maps (see NYC below)
www.comparetracks.com

ninemsn's rip-off site
Rip-off of my favourite site (above) at mapmyfitness.ninemsn.com.au - slow maps and pretty basic functionality.

BikeMap.de
In German, but you get the idea...
www.bikemap.de

Run.com
Great URL but seems relatively new (ie. very few runs in the database)... uses Google Maps.
www.run.com

and for watching only

BBC
Tour de France map - the BBC always does great stuff on the web.

New York City Marathon
NYC marathon simlator requires Java, and provided by Sportsim (who have open-sourced their software as CompareTracks - see above).

...and "sorta" related
RunPix
RunPix doesn't have an interactive map, but does do 'race statistics visualization', including a static map of where you were on the course when the leaders finished.

RaceReplay 'RC1' (now with Silverlight & Virtual Earth)

www.racereplay.net release 3 is now live:

• updated to use Silverlight RC1


• courses like Sutherland to Surf and Gold Coast 1/2 Marathon now use Microsoft VirtualEarth


• 85,000 results online

The Designer will be mortified that I've munged the beautiful work he did by adding those dodgy arrows, but I'm sure you'll agree it's a big improvement!

When non-runners strike...

This is what happens when a "non-runner" publishes a race map on the web... That's a big jump off the Cahill Expressway onto Macquarie Street, guys.

Who would do such a thing? It's ninemsn's new "mapmyfitness" site, with a blatant ripoff (even the name!) of a better established, better written US-based site http://www.mapmyfitness.com/.

Too bad the ninemsn site is slow as a wet-week - I "think"' they've missed the point about JSON being light-weight

value="[
{"__type":"Ninemsn.Simba.WebControls.VE.ShapeLayer,
 Ninemsn.Simba.WebControls, Version=1.0.2708.32310, Culture=neutral,
PublicKeyToken=null","Title":"Edit
Layer","Description":"","Shapes":
[{"__type":"Ninemsn.Simba.WebControls.VE.Shape,
Ninemsn.Simba.WebControls, Version=1.0.2708.32310, Culture=neutral,
PublicKeyToken=null","_id":null,"ShapeType":1,
"Title":null,"Description":null,"CustomIcon":null,
"CustomType":"Line","PhotoUrl":null,
"Points":[{"__type":"Ninemsn.Simba.WebControls.VE.LatLong,
Ninemsn.Simba.WebControls, Version=1.0.2708.32310, Culture=neutral,
 PublicKeyToken=null","Latitude"
:-33.8479105875013,"Longitude":151.211593151093},
{"__type":"Ninemsn.Simba.WebControls.VE.LatLong,
Ninemsn.Simba.WebControls, Version=1.0.2708.32310, Culture=neutral,
PublicKeyToken=null","Latitude":
-33.8460304508373,"Longitude":151.211292743683},

or, if you preferred:

value="[
{"Title":"Edit Layer"
,"Points":[
 {"Latitude":-33.8479105875013,"Longitude":151.211593151093}
,{"Latitude":-33.8460304508373,"Longitude":151.211292743683}
,{"Latitude":-33.8450770007942,"Longitude":151.211131811142}

Okay okay, I'm being harsh - maybe it's generated output from astoria - but the maps are slow to navigate. I wonder how the sponsor "Kellogg's Special K" feels about it - maybe they should go back to ninemsn to get it sped up (and maybe the map resized?)



It's certainly no "RaceReplay" :)

Silverlight 1.0 RC - bug fixed!

Yes, RC1 of Silverlight 1.0 has been released (in case you missed the announcements).

Thankfully the breaking changes haven't really affected the stuff I've been playing with - it's been a fairly painless change to swap in the updated Silverlight.js file and tweak the createSilverlight() function (Sys.* has been removed - shouldn't clash with ASP.NET AJAX now):

Silverlight.createObjectEx({
    source: 'Scene.xaml', 
    parentElement: document.getElementById("SilverlightControlHost"),
    id:'SilverlightControl', 
    properties:{
        width:'100%', 
        height:'100%', 
        framerate:'24', 
        enableFramerateCounter:false, 
        version:'1.0'},
    events:{
       onError:null, onLoad:null, onResize:null
    },
    context:null
});

What's even better is that it fixes the bug on this 400-element animation. The beta used to just 'freeze' about two-thirds of the way through the animation: all the dots stopped moving until the timeline 'finished', then they'd all disappear (jump straight to end). Now it works seemlessly - time to try it with more animated objects!

What is Astoria?

While I wait for amazon to deliver RESTful Web Services, there's plenty to read on the web...

Jon Udell posts an interesting example of a RESTing transaction... seems to me there are very few 'example interactions' around to help people understand how REST is 'different', so it makes an interesting read.

If you prefer an explanation rather than a lot of reading, watch Pablo Castro introduce Astoria Data Services (pre-MIX) and at MIX "Accessing Data Services in the Cloud" (then subscribe to his blog about Astoria and Entity Framework stuff).

SOT: If, like me (after doing a bit of reading about REST and then JSON), you started to wonder if JSON isn't superior to Xml in many respects, you'll want to download JSON Viewer as you start to build applications with it.

P.S. How do you get a job like Pablo's?

Microsoft admits: "Xml isn't everything"

With Xml, Serialization and Web Services baked into the first .NET Framework at a time that the Java world only had fairly rudimentary optional add-ons, it seemed like Microsoft was 'finally embracing an open standard' ahead of the curve... Xml has continued to become a cornerstone of .NET and Office (and BizTalk, and SharePoint, and...) ever since.

The "problem" with Xml is the growing 'weight' of Xml implementing even a basic solution "properly" - namespaces, XSD, WSDL, SOAP, WS-* standards, etc. It's no longer just a simple case of throwing a few tags together to get something done.

While Microsoft continued down the Xml-and-WS-in-.NET road, others (the Ruby community, for a start) popularised Representational State Transfer (REST Web Services).

It's light-weight and much easier to use with AJAX and other RIAs, in part because it's not Xml-centric but open to simpler 'data syntax' such as JSON. JSON slots seemlessly into browser script interpreters without pesky translations or reliability on XmlHttp implementations, so the cross-browser/standards crowd cottoned on quickly. Even 3rd party Microsoft solutions like Ajax.NET Pro used JSON.

Which brings us back to Microsoft, who appear to have 'got the message'.

MSDN recently featured an Introduction to JavaScript Object Notation (JSON) in JavaScript and .NET, comparing JSON to XML, and then subsequently released Astoria at Mix07 (an announcement likely overshadowed by the release of Silverlight).

Astoria enable(s) applications to expose data as a data service that can be consumed by web clients within corporate networks and across the internet. The data service is reachable over regular HTTP requests, and standard HTTP verbs such as GET, POST, PUT and DELETE are used to perform operations against the service.
The payload format for the service is controllable by the application, but all options are simple, open formats such as plan XML and JSON.
The use of web-friendly technologies make it ideal as a data back-end for AJAX-style applications, Rich Interactive Applications and other applications that need to operate against data that is across the web.

Compare the request format
http://astoria.sandbox.live.com/encarta/encarta.rse/Articles[Title%20eq%20'Aerobics']?$expand=RelatedArticles to a comparable SOAP-formatted request... and if it wasn't disabled by default, you'd get JSON back instead with http://astoria.sandbox.live.com/encarta/encarta.rse/Articles[Title%20eq%20'Aerobics']?$expand=RelatedArticles&$format=json

For now Astoria is an alpha/beta to help us become familiar with the concepts behind it. It is (apparently) based on Windows Communication Foundation (.NET 3.0), so it may not end-up being as 'light' as you think.

Would/could/should you base your SOA on REST/JSON, or stick with XML/SOAP? The answer may be in O'Reilly's RESTful Web Services, but then there's no substitute for trying it out yourself... your application's authorization, authentication, topology, scalability, complexity, distribution, platform, usergroup/s can only begin to guide you towards the right decision.

UPDATE: Came across these links after posting:
Will Web 2.0 displace the WS-* protocols?
The Merging of SOA and Web 2.0

Synchronized dragging: Silverlight and Live Maps/Virtual Earth

Further to this post on Synchronizing Live Maps & Silverlight canvas, you can now pan by dragging rather than just using the rather clumsy up/down/left/right links: both the Silverlight Canvas containing the animation AND the underlying Microsoft Live Maps can be dragged (together)!

You can try out the demo of a Silverlight & Live Maps overlay with synchronized dragging to pan (it's not yet integrated into RaceReplay.net).

It was a relatively simple implementation of the sample code provided by then Silverlight Mouse Support documentation on MSDN. As with most Silverlight stuff, you can just View Source to see how it works...

Look out MapCruncher (joking!)

UPDATE: zooming now works too. When 'implementing' the Mouse Support example, I blindly copied

    canvasT.X = canvasPixel.x;
    canvasT.Y = canvasPixel.y;

into onMouseUp(), forgetting that I was also updating

        sender["Canvas.Left"] += currX - beginX;
        sender["Canvas.Top"] += currY - beginY;

in onMouseMove(). Oops. Better to update that same property and avoid applying the 'transformation' twice...

    sender["Canvas.Left"] = canvasPixel.x;
    sender["Canvas.Top"] = canvasPixel.y;

Also added a new cursor to indicate the map is 'draggable' - unfortunately Silverlight has a limited set of cursors to choose from, so the hand-pointing is used rather than open-hand.

Thinq Linq

If your initial impressions of Linq are that it's mainly for data-access (because of the syntax similarities to SQL, and the availability of Linq to SQL), thinq again!

The Linq Cookbook (although in Visual Basic) demonstrates the sorts of problems you can now solve in a couple of lines of code:

• Change the font for all labels on a windows form


• Find all capitalized words in a phrase and sort by length (then alphabetically)


• Find all complex types in a given assembly


• Find all the prime numbers in a given range


• Concatenating the selected strings from a CheckedListBox

If you do want to read more about Linq and SQL/data access, Explore LINQ, SQLMetal and SqlTac courtesy of Red-Gate.

"Corporate"Book?

Interesting article about Facebook for the Enterprise.

"Today, I see a combination of Twitter and Facebook as having the potential to replace 90% of the email I receive while improving my personal productivity."

Many companies still don't see IM as anything other than a nuisance to be blocked, so it's sorta interesting to think about whether spending time on Facebook can be 'productive'.

Quote from Facebook generations

"...my 14-year-old daughter is appalled that I am a member of Facebook, and refuses to let me friend her, lest her other friends find out via News Feed."

raises an issue with I suspect would extend into "Corporate"Book - do you really want everyone knowing everything about you... at work?

[sot] Apparently Australia is the 5th biggest Facebook community, after USA, Canada, UK & Norway!

UPDATE: Looking for Facebook applications or ideas? - someone's already started a 'portal' for Facebook apps and news. Helps find neat new stuff, like the Facebook ToolBar for Firefox - because you don't spend enough time checking Facebook already...

Synchronise Live Maps & Silverlight canvas

If you overlay a location-specific Silverlight canvas on a Live Map (or is it Virtual Earth?, you'll probably want to 'synchronise' the canvas with the underlying map as it is panned/zoomed.

Although it might seem a tough task, with the help of the Virtual Earth 5 SDK it's relatively easy.

Firstly, check out the end result - a Silverlight canvas/animation that zooms and pans with the Live Map underneath it.

To accomplish the effect, I needed to:

0. Load the map and Silverlight controls

map = new VEMap('myMap');
map.LoadMap( 
  new VELatLong(-33.865052673579655, 151.22375965118408), 
  16, VEMapStyle.Hybrid);
//...
Sys.Silverlight.createObject( "xaml/Domain.Xaml", ...

Remembering to set isWindowless:'true' and the position of the elements so they float together.

1. Add Scale and Translate Transforms to the canvas

lt;Canvas.RenderTransform>
  <TransformGroup>
    <ScaleTransform ScaleX="1" ScaleY="1" 
        x:Name="canvasScale" />
    <TranslateTransform X="0" Y="0" 
        x:Name="canvasTranslate" Name="canvasTranslate" />
  </TransformGroup>
</Canvas.RenderTransform>

(this was the only change required to the Xaml). You will use the x:Names later to make it easy to transform the canvas.

2. Determine the lat-long of the canvas

So that you can always position it accurately, regardless of how the map has been panned or zoomed. In this case, the top-left of the canvas should be is at 33.858210507117995, 151.2127733230591, and the map center when loaded is -33.865052673579655, 151.22375965118408.

3. Support panning
Simply shift the map and canvas by the same pixel delta, eg. simply call the Pan function on the map object, and modify the named TranslateTransform on the canvas.

function MoveNorth()
{
   map.Pan(0, -100);
   var sl8 = document.getElementById("WpfeControlHost_1");
   var canvasT = sl8.content.findName("canvasTranslate");
   //canvasT.X = canvasT.X - 100;
   canvasT.Y = canvasT.Y + 100;
}

4. Support zooming
Other than a little bit of hardcoding, the zoom javascript is pretty simple

function ZoomIn()
{
    map.ZoomIn();
    var zoom = map.GetZoomLevel();
    media_scale(zoom);
    return false;
}
function media_scale(zoomLevel)
{
    var sl8 = document.getElementById("WpfeControlHost_1");
    var canvasT = sl8.content.findName("canvasTranslate");
    var canvasS = sl8.content.findName("canvasScale");
    
    var canvasLatLong = new VELatLong(-33.858210507117995, 151.2127733230591);
    var canvasPixel = map.LatLongToPixel(canvasLatLong);

    canvasT.X = canvasPixel.x;
    canvasT.Y = canvasPixel.y;
              
    if (zoomLevel == 17)
    {
       canvasS.ScaleX = 2;
       canvasS.ScaleY = 2;
    } 
    else if (zoomLevel == 16)
    {
       canvasS.ScaleX = 1;
       canvasS.ScaleY = 1;
    }
    else if (zoomLevel == 15)
    {
       canvasS.ScaleX = 0.5;
       canvasS.ScaleY = 0.5;
    }
    else if (zoomLevel == 14)
    {
       canvasS.ScaleX = 0.25;
       canvasS.ScaleY = 0.25;
    }
    else if (zoomLevel == 13)
    {
       canvasS.ScaleX = 0.125;
       canvasS.ScaleY = 0.125;
    }
    else if (zoomLevel == 12)
    {
       canvasS.ScaleX = 0.0625;
       canvasS.ScaleY = 0.0625;
    }
// haven't supported tinier zoom levels - might need to just hide content?
}

As long as your canvas and map loaded 'in sync', the panning should work without trouble, and if the top-left lat-long of your canvasis set, zooming should work too. Note that the scale-factors will depend on what 'resolution' your original Xaml was drawn in - I was tracing a map at zoom level 16 (as you can see).

There's a lot more you could add to this - including animating the zoom and supporting 'drag' for the canvas and map...

Silverlight/Live Maps overlay

sydney landmarks is based on
Using Opacity with a Silverlight / Virtual Earth Mashup (Remix) - in addition to changing the locations it's also using v5 of the map sdk (rather than v4).

The idea is to eventually get RaceReplay.net working with 'live' maps rather than using embedded images.

No source is "posted" - it's all right there in the browser for the View Source Reflector tool for Silverlight to see.

New code online...

New code uploaded on

RaceReplay.net - more courses, satellite imagery

RecipeNow.net - new look, SEO friendly pagenames (Silverlight 'recipe book' "coming soon")

Nothing new on Searcharoo.net but came across some more 'users': Ultimate Safari, Health service. Kinda funny seeing it in the wild.