Silverlight VirtualEarth Map Control - with animation

UPDATE: The Microsoft devs were right - it is possible (and not a bug). The 'complete' sample now keeps the image, course line and animated objects visible during all panning and zooming operations - try out
animation with Silverlight Virtual Earth Map Control!

I've made some progress with my first Silverlight Virtual Earth Map Control project...

Try it out (deprecated) latest

Here are some screenshots of the zoom/animation in action:



The code and xaml also online - I needed to (well, I think I needed to) use the ViewChangeEnd event to re-calculate various offsets and dimensions to keep the animation and overlay image sychronised with the Map Controls' zoom behaviour (even though panning worked without modification).

OpenSearch 'Visual Search'aroo (for IE8)

About 6 months ago I added OpenSearch.xml to searcharoo.net.

Now that IE8 has been released there is a new "Visual Search" feature that can be enabled via opensearch.xml.

When you visit searcharoo.net, OpenSearch-supporting browsers will provide a visual indicator (eg. this colored arrow) that you can add that site as a Search Provider.


Choose to add Searcharoo.net...


...and tick the box that you want to use search suggestions


Once it is set-up, you will receive real-time feedback/results as you type your search!



I did have some problems implementing it, however. The original post I saw was using a beta, and the latest documentation Search Provider Extensibility in Internet Explorer and XML Search Suggestions Format Specification shows the XML required is slightly different.

This was the opensearch.xml file that actually worked for me:
<?xml version="1.0" encoding="UTF-8"?>
<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/" xmlns:ie="http://schemas.microsoft.com/Search/2008/">
<ShortName>Searcharoo.net</ShortName>
<Image height="16" width="16" type="image/icon">http://www.searcharoo.net/favicon.ico</Image>
<Url type="text/html" template="http://www.searcharoo.net/Search.aspx?searchfor={searchTerms}"/>
<Url type="application/x-suggestions+xml" template="http://www.searcharoo.net/SearchSuggest.aspx?searchfor={searchTerms}"/>
<ie:PreviewUrl type="text/html" template="http://www.searcharoo.net/SearchSuggest.aspx?searchfor={searchTerms}"/>
</OpenSearchDescription>

with the following added to the .master page

<link rel="search" type="application/opensearchdescription+xml" href="/opensearch.xml" title="Searcharoo.net">

I'm still working on improving the output of the search, but you can view it's response to the browser using this URL - http://www.searcharoo.net/SearchSuggest.aspx?searchfor=manhattan (note the addition of xmlns). The XML also supports image/previews, so Searcharoo will need another upgrade to support that too..

MIX 10k entry goes OutOfBrowser

I have updated my MIX 10k Challenge entry to Silverlight 3.0 so itcan run out-of-browser!

You can visit the Silverlight 3.0 version of exploDZ, and install it locally for yourself WARNING: will prompt to install Silverlight 3.0 which is in BETA

1. Right-click and choose to Install


2. Select "where" to install (this is really only where the shortcuts go)


3. Silverlight 3.0 having an out-of-browser experience


This is really only a test of Silverlight 3.0 - exploDZ was just a bit of fun, and there is already an ClickOnce/WPF version at DeepZoomPublisher.com/Viewer.

Code changes

Thanks to Chris' Silverlight 3.0 out-of-browser instructions the ONLY change from the 2.0 to the 3.0 (out-of-browser) version was the following element added to the AppManifest.xml file:

<Deployment.ApplicationIdentity>
<ApplicationIdentity
ShortName="exploDZ"
Title="Out of browser DeepZoom Viewer">
<ApplicationIdentity.Blurb>
exploDZ out-of-browser (Silverlight 3.0)
</ApplicationIdentity.Blurb>
</ApplicationIdentity>
</Deployment.ApplicationIdentity>

What it does

The shortcut created by the 'installer' has a target like this:
"C:\Program Files\Microsoft Silverlight\3.0.40307.0\sllauncher.exe" conceptdevelopment.net.0
I guess that parameter reflects the 'source site' and index of Silverlight OutOfBrowser apps -stored in a safe place somewhere :) stored in Apps\LocalLow\Microsoft\Silverlight\Offline\ (on Windows 7 at least).


The index.html ISN'T the hosting page from the internet - it's a custom Silverlight object tag:


The metadata file contains
LaunchPath=C:\Users\Craig\AppData\LocalLow\Microsoft\Silverlight\Offline\conceptdevelopment.net.0\index.html
SourceDomain=conceptdevelopment.net
OriginalUri=http://conceptdevelopment.net/silverlight3/outofbrowser01/exploDZ.zip
AppID=conceptdevelopment.net.0
Description=exploDZ out-of-browser (Silverlight 3.0)
Title=Out of browser DeepZoom Viewer
Name=exploDZ

How it works?

Who knows??? Tim's Silverlight 3 Out-of-browser Update Model overview is a worthwhile read.

Adobe's AIR out-of-browser host for Html-Javascript and Flash/Flex sits atop WebKit, and from the index.html above it seems likely that OutOfBrowser-Silverlight is also sitting in a little web browser of some description. It's only 500Kb, so it's not IE :) - and there also has to be a Mac version... it doesn't appear to be managed code (or I'd guess Cassini), maybe the Mac one is related to Chiron? Speaking of Mac - this is how it looks in Safari 4 beta...

Silverlight VirtualEarth Map Control - with DeepZoom Images

"TagUpdater" parses through your Deep Zoom metadata.xml, opens the images and reads EXIF title/description/tag data... so it was pretty simple to extend it to read latitude & longitude.

The location of each Deep Zoom sub-image is then available to display on a map, in the Tag Browser sample:


1. Metadata.xml entries now look like this
<Image>
<FileName>C:\Dev\Cities\bhutan_tigersnest.jpg</FileName>
<x>0</x>
<y>0.127264287334191</y>
<Width>0.199250151375691</Width>
<Height>0.203911475380207</Height>
<ZOrder>11</ZOrder>
<Tag>bhutan</Tag>
<Description>Amazing monastery perched on a cliff in Bhutan near Paro</Description>
<Rating>0</Rating>
<Title>Tiger's Nest</Title>
<LatLong>27.4266666666667,89.4033333333333</LatLong>
</Image>

2. We add a Silverlight VirtualEarth Map Control
xmlns:m="clr-namespace:Microsoft.VirtualEarth.MapControl;assembly=Microsoft.VirtualEarth.MapControl"
<m:Map x:Name="viewMap" Grid.Row="3" Height="220" Opacity="0.25" />

3. and in the code add a new MapLayer
MapLayer PinMapLayer = new MapLayer(); // Layer on map to 'add' stuff to [MAP]

viewMap.AddChild(PinMapLayer);

4. Then display the pins within the xmlClient_DownloadStringCompleted method (originally from Kirupa's sample)
//Now add to map [MAP]
if (latlongString != "")
{
var l = new Location(
Convert.ToDouble(latlongString.Split(',')[0])
, Convert.ToDouble(latlongString.Split(',')[1])
);
Image pin = new Image();
pin.Source = new BitmapImage(new Uri("blue_pushpin.png", UriKind.RelativeOrAbsolute));
pin.Stretch = Stretch.None;
var tooltipObject = new StackPanel();
var title = new TextBlock();
title.FontWeight = FontWeights.Bold;
title.Text = titleString;

tooltipObject.Children.Add(title);
var description = new TextBlock();
description.Text = descriptionString;
tooltipObject.Children.Add(description);

ToolTipService.SetToolTip(pin, tooltipObject);
// Adds the pushpin to the map layer.
PinMapLayer.AddChild(pin, l, PositionMethod.BottomCenter);
}

5. and in msi.MouseMove, move the map for the 'current' image
l = new Location(
Convert.ToDouble(imageMetadata[subImageIndex].LatLong.Split(',')[0])
, Convert.ToDouble(imageMetadata[subImageIndex].LatLong.Split(',')[1])
);
viewMap.Opacity = 1;
viewMap.SetView(l, 12);

If you play with it it will be obvious there are some useability issues with changing the map 'on hover' over the images (it's difficult to get the mouse over to the map if you want to navigate around), but the Silverlight VirtualEarth Map Control definitely makes it easy to build!

Silverlight VirtualEarth Map Control - Search Results

Try out a basic search results view using the Silverlight VirtualEarth Map Control at searcharoo.net/SilverlightMap.html...




Thanks to Chris Pietschmann's Tooltip example each pin shows what search result it refers too (although I still haven't figured out to make the pins 'click-able' to open the result link directly...).

The relevant code added to the search result JSON parsing:

1. Create a MapLayer
MapLayer PinMapLayer = new MapLayer();

2. Add it to the Map control first (ie. before adding Children)
ResultMap.AddChild(PinMapLayer);

3. Extract GPS location
var l = new Location(
Convert.ToDouble(result.gps.Split(',')[1])
, Convert.ToDouble(result.gps.Split(',')[0])
);

4. Create the pin (Image), add tooltip and add to MapLayer
Image pin = new Image();
pin.Source = new BitmapImage(new Uri("blue_pushpin.png", UriKind.RelativeOrAbsolute));
pin.Stretch = Stretch.None;

var tooltipObject = new StackPanel();
var title = new TextBlock();
title.FontWeight = FontWeights.Bold;
title.Text = result.name;
tooltipObject.Children.Add(title);
var description = new TextBlock();
description.Text = result.description;
tooltipObject.Children.Add(description);
ToolTipService.SetToolTip(pin, tooltipObject);

// Adds the pushpin to the map layer.
PinMapLayer.AddChild(pin, l, PositionMethod.BottomCenter);


The search box is pre-populated with manhattan which results in a set of photos.



Perform that search, then search for sydney to see how the VirtualEarth Silverlight Map Control animates between the two locations with nothing more than a simple call to SetView

ResultMap.SetView(GetMinMaxCenter(min, max), 12);

The complete code will be available on Searcharoo@Codeplex shortly.

p.s. another search to try is - pumpkin - geocoded photos are so cool!

Silverlight VirtualEarth Map Control - in "3D"

Further to my previous post on the Silverlight VirtualEarth Map Control - here it is in Silverlight 3.0 WARNING: will prompt to install Silverlight 3.0 - which is in BETA - do so at your own risk!


The animation and map styles (road|arial) work as you'd expect, but somehow it looks a lot cooler with this little bit of code added :-)

<Canvas.Projection>
<PlaneProjection RotationX="-60" />
</Canvas.Projection>

BTW, it seems to me like addition of 3D Projection (rather than a complete 3D environment, ala Kit3D and WPF) is the minimum they needed to add to get Photosynth working "natively" in Silverlight (instead of the current Silverlight-Photosynth beta which does use Kit3D)? ... hmmm ...

Silverlight VirtualEarth Map Control - initial impressions

Microsoft was bound to deprecate all the work on silverlightearth.com (and others on DeepEarth) at some point :D - and they've finally released a CTP of their efforts.

The control can be downloaded from Microsoft Connect: Silverlight Map Control - you have to register and fill in a survey first but then you're good to go. There is also a Getting Started guide to help, you know, get started.

It's actually pretty simple:

• Add Reference to Microsoft.VirtualEarth.MapControl


• Add namespace xmlns:m="clr-namespace:Microsoft.VirtualEarth.MapControl;assembly=Microsoft.VirtualEarth.MapControl"


• and Xaml <m:Map x:Name="viewMap"/>


• sprinkle a bit of C# (unnecessary, but why not)
viewMap.View = new Microsoft.VirtualEarth.MapControl.MapViewSpecification(new Location(40.7199, -74.0030), 12.0000); //New York

and you've got a map!

Details

The control doesn't like being hosted on the filesystem (good old WebClient and ClientAccessPolicy restrictions I suppose) so when creating your first test project, remember to hook up a WebApplication as well...



otherwise you'll get the same error as the design surface does


but a WebApplication with an automatically created TestPage works just fine



Naturally I then wanted to apply it to something useful, so you can give this New York Marathon (2006) visualizer a go... in case it isn't obvious, it's showing how far behind the winner I was (and how far behind me Lance was :)

I've blocked panning/zooming on it for now (until I figure out how to keep the animations and course in sync), but that is a bona-fide Microsoft Virtual Earth Silverlight Control (CTP) in there!

UPDATE [22-Mar]: I've updated the example so that dragging/panning works BUT zooming is still broken. I think I've copied the iSDK Add scalable element example exactly (but their Rectangle scales and my content doesn't). Weird...

The change was to move the 'animation canvas' inside the Map, like this:
<m:Map.Children>
<m:MapLayer>
<Canvas
m:MapLayer.MapRectangle="40.8325608405556,-74.1015908473376,40.5722860972124,-73.843755459154"
m:MapLayer.MapPositionMethod="Rectangle"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch">

That didn't take long at all - so initial impressions are good. The map controls are very smooth and the basic stuff is intuitive to program around. In addition to the links above, you will want to play with the Interactive SDK and keep the SDK CHM handy until sample code starts appearing in the wild...

I wonder what the release date and go-live licensing details are???

Adding Searcharoo to CodePlex

Decided to add the Searcharoo version 7 code to CodePlex so that it's easier to release bugfixes between 'versions', and possibly invite other developers to participate (although not sure if that will make it less 'fun' to play around with).

Anyway, the process (while simple) didn't really have a great set of instructions to guide me through it (or else I just couldn't find them). Either way, I decided to document my experience for others → Adding Searcharoo to CodePlex (open to the public soon).

Photosynth for iPhone : iSynth

I recently blogged about Photosynth being available on Macs and Linux via Moonlight, but having real Photosynth on the iPhone is pretty darn cool! You might as well just download it now (if you have an iDevice) and read the instructions.

Here's a quick preview of how it looks (read to the end for my favourite feature). The navigation has an 'iPhone-y' feel to it:

and it was easy to find my own previously uploaded synths:

navigation is similar to the desktop version (and ever so slightly unintuitive on the iPhone occasionally, when you seem to have to 'drag' the opposite way to what you expect)

but my FAVOURITE features are the point cloud and camera positions... you can clearly see (below) that my entire 'Sydney Harbour Synth' was formed from photos taken off a ferry travelling across the harbour (away from the CBD)!


I'm impressed! Even moreso since it wasn't even written by Microsoft, but an intern who worked in the Photosynth team last year. Great job Greg Pascale!

Xap != Zip (Silverlight gets confused)

After I had tested (or thought I'd tested) and uploaded the Searcharoo version 7 CodeProject article, I deployed 'example code' to searcharoo.net, including the Silverlight UI. I was shocked and annoyed when it failed to run!

It's worth noting that my hosting provider doesn't server .XAP files by default, so of course I had just renamed the Silverlightaroo.XAP to Silverlightaroo.ZIP, updated the reference in the HTML and expected it would work (like Tim says it should).

BUT all I got was

Microsoft JScript runtime error: Unhandled Error in Silverlight 2 Application This operation is not supported for a relative URI. at System.Uri.get_Host()

I was confused why this would work fine with .XAP but not with .ZIP... these are the three scenarios I tried to get it working:

1. <param name="source" value="Silverlightaroo.xap" />

This works fine on my local PC, but breaks on my hosting provider because the XAP file returns a 404 so the Silverlight application never loads.

When it works locally, you can see that the Application.Current.Host.Source properties are all populated correctly:



2. <param name="source" value="Silverlightaroo.zip" />

Because option #1 doesn't work on my server, I simply renamed .XAP→.ZIP and updated the HTML - but this causes the error shown above. When I debug the Silverlight, the Application.Current.Host.Source properties all throw exceptions:



3. <param name="source" value="http://localhost:3359/Silverlightaroo.zip" />

The solution was to use the FULL path to the Silverlight .ZIP file, and once again the Application.Current.Host.Source properties are populated:


This is not ideal, because now I have to remember to change the HTML OBJECT tag "source" PARAM between development/test and production servers - but at least it works! You can see the page in action.

Is it just me - or is this a bug?

Searcharoo 7.0

The latest incarnation of my open-source ASP.NET no-database-required C# search engine has been updated: Searcharoo version 7 (and on CodeProject)!

It's not a significant release in terms of functionality (just adds proper document excerpt/term highlighting to the results), but it was quite a bit of work to make that happen.

Plus I added some new 'toys': a JSON-formatted result page and two rich-clients that use it (jQuery/AJAX and Silverlight 2.0).



You can play with the jQuery and Silverlight examples online (try searching for parse, search, row, sydney, manhattan or pumpkin)
http://searcharoo.net/jSearcharoo.html
and
http://searcharoo.net/Silverlight.html

This will be the last .NET 2.0 version of Searcharoo - future versions will be in .NET 3.5, looking to take advantage of Linq and maybe even Azure...

p.s. You can read about all the previous versions (since 2004) on CodeProject: versions 1 2 3 4 5 and 6.