May 18, 2012

SharePoint Mapping – Part 1: Hosting a Silverlight Application in SharePoint 2010

Denis Stetsenko

Denis Stetsenko

Default image background

This is the first post in a series that explores how a data-driven mapping application can be hosted in SharePoint 2010, and how data stored in SharePoint can be used to extend a data-driven application. In this post, we will focus on how to host a mapping application in SharePoint 2010.

Why mapping you may say? Because maps are useful, fun, and they are everywhere. They have become the essential tool for anyone looking for a specific location or driving directions. Maps are accessible via standalone desktop client applications, web browsers, mobile browsers and applications, GPS units, etc. In the business realm, maps get even more useful as they have power to present lots of complex geographic information in a simple visual way. A variety of business models can and should utilize mapping technologies on their internal and customer-facing web sites. To get some ideas, I encourage you take a look at an informative blog post written by my colleague Jason Heilig entitled How Virtually Any Business Can Improve through Utilizing Web Mapping Technology.

Why SharePoint? Because it’s a perfect environment for hosting data-driven applications in general. SharePoint is the content management and collaboration platform of choice for millions of businesses. It provides extensive collection of APIs that can be used to get any LOB application’s information into SharePoint, and expose SharePoint content via intranet, extranet, and public sites.

Although mapping solutions can be implemented using a variety of technologies, one of the best ways to do it for the web is to utilize Silverlight and Bing Maps. SharePoint 2010 and Silverlight are a match made in heaven – if you hosted a Silverlight application in MOSS 2007, you will appreciate how simple it is to do in the new version. SharePoint 2010 uses Silverlight to enhance user experience and provides an easy way for hosting Silverlight applications on any page. For more details, take a look at my blog post entitled Silverlight Enhancements in SharePoint 2010. Bing Maps provides the Silverlight Control API that makes it easy to utilize powerful mapping technology within your custom interactive solutions.

Increase business process efficiency and collaboration with Microsoft SharePoint

Explore Our Microsoft Consulting Services  →

To show how to host a Silverlight application in SharePoint 2010, you will first need to create one. If you don’t already have one, you can follow the walk-through provided by Credera’s mapping and Silverlight expert Kevin King in his blog post entitled Building Interactive Maps with Silverlight and Bing Maps. This is not your typical Hello World application, is it?

My colleague and our CRM pro, Rick Gipson, has also written a similar blog post entitled Hosting a Silverlight Application in CRM 2011. If you use CRM within your organization, you should check it out.

So, here’s how to host a Silverlight solution in SharePoint:

  • Upload the Silverlight application to a SharePoint library

  • Add a Silverlight Web Part to any page

  • Customize the Silverlight Web Part

Upload the Silverlight application to a SharePoint library

In order to be able to host a Silverlight application in SharePoint, all you have to do is to add it to a SharePoint library. Silverlight application is essentially a .XAP file that needs to be hosted in SharePoint. You can use Site Collection Asset Library, or any library within a sub-site. In my demo environment, I have a sub-site called Mapping, which has an asset library called Assets, where I uploaded the .XAP file. Since we will need the path to this file in the next step, just right click on the file within the library and choose Copy Shortcut in the context menu.

Add a Silverlight Web Part to any page

Navigate to a page where you want to add the map. Edit the page and click on Add a Web Part in the desired zone. Navigate to the Media and Content category, choose Silverlight Web Part, and click Add. A modal dialog will pop up asking you to enter the URL of the application package, paste the path you have in the clipboard and click OK.

Figure 1 – Adding a Silverlight Web Part

The mapping application should now render on the page. If you don’t see it, then check the path you supplied to the web part for errors.

Yes, you guessed it right, you can also display externally hosted Silverlight applications in SharePoint by providing their full URL to the Silverlight Web Part. Keep in mind though that this web part has a hard-coded timeout period of 5 seconds, so if for some reason the .xap file does not load during that time, you’ll get an error. There are some workarounds for that though.

Figure 2 – Silverlight Web Part Timeout Error

Customize the Silverlight Web Part

As usual, you can open the web part settings dialog and set the desired web part title, height and width, etc.

SharePoint also allows you to customize this particular instance of the Silverlight application using initialization parameters. So, if your Silverlight application accepts any, you can enter them as one string in the Custom Initialization Parameters field under Other Settings in the tool pane. Each parameter should be separated by a comma, as shown below:


Make sure not to add spaces in between the parameters. The maximum length of this string is 255 characters, so you need to be creative or use some workaround to fit all your parameters.

Figure 3 – Silverlight Web Part Properties

And here is the final result.

Figure 4 – Silverlight Map Hosted in SharePoint 2010

As you can see, hosting a Silverlight application in SharePoint 2010 is a pretty straightforward process. Not only can you host a Silverlight solution in SharePoint within minutes, but you can also customize it with the help of initialization parameters without much effort.

In the future posts, we will explore how to extend this application with data stored within SharePoint.

Conversation Icon

Contact Us

Ready to achieve your vision? We're here to help.

We'd love to start a conversation. Fill out the form and we'll connect you with the right person.

Searching for a new career?

View job openings