Jaa


Building a Mashup with Bing, Silverlight, and SharePoint 2010

So a bit of a preview for you about one of the solutions from my new book, Pro SharePoint 2010 Solution Development.

This one shows how you can use the Silverlight Bing Maps control to build a SharePoint solution that layers data from a KML file, Geocoded RSS feed, and a SharePoint 2010 list. The beauty of the solution is that since it is Silverlight-based, you can use the new client-side library for talking to SharePoint. This means that getting the list data onto the map is almost trivial. The appearance is that you might think it is server-side code, but it isn't. In this example, campgrounds is the SharePoint list which has a content type that is dervived from the out-of-the-box contacts content type. Here is some code from the load event of the user control.

 private void UserControl_Loaded(object sender, RoutedEventArgs e)
{
context = SP.ClientContext.Current;
web = context.Web;
campgroundList = web.Lists.GetByTitle("Campgrounds");
SP.CamlQuery query = new SP.CamlQuery();
query.ViewXml = "<View><Query><Where><Eq>" +
"<FieldRef Name='GeocodeStatus'/><Value Type='Choice'>Geocoded</Value>" +
"</Eq></Where></Query></View>";

        campgroundItems = campgroundList.GetItems(query);
context.Load(campgroundItems);
context.ExecuteQueryAsync(requestSucceeded, requestFailed);
}

And then since everything is Async in Silverlight, we have to use some UI delegates to make sure everything is happening on the right thread:

private void requestSucceeded(object sender, SP.ClientRequestSucceededEventArgs e)
{
UpdateUIMethod updateUI = AddCampgroundPins;
this.Dispatcher.BeginInvoke(updateUI);
}

Lastly, adding the pins to the right map layer for each SharePoint item...

private void AddCampgroundPins()
{
foreach (SP.ListItem item in campgroundItems)
{
Pushpin pin = new Pushpin();
pin.Tag = item["Company"].ToString();
double latitude = (double)item["Latitude"];
double longitude = (double)item["Longitude"];
Location loc = new Location(latitude, longitude);
pin.Location = loc;
pin.MouseEnter += new MouseEventHandler(pin_MouseEnter);
pin.MouseLeave += new MouseEventHandler(pin_MouseLeave);

     PinLayer.Children.Add(pin);
}
}

 I have also posted a video walkthrough of the demo on skydrive which you can download here. Enjoy! And send your feedback - Ed

Comments

  • Anonymous
    June 09, 2010
    I love how you combined the multiple sources and demontrate the new client side API.