Wednesday, December 29, 2010

Silverlight Pivot Viewer

For those that have not seen/used the Silverlight Pivot viewer, its definitely worth a look. It is an interesting control which allows you to navigate large amounts of data in very interesting ways. It gives the user the ability to view different aspects of the data and do their own filtering. The Pivot Viewer shows Deep Zoom Images as the output format, which allows the user to drill down into the required information.

Probably easier to view by example:
NetFlix has a working example of Pivot Viewer

Keeping this in mind, its probably best to use the Pivot Viewer with information which has large amounts of attributes. This will then give the user more options to 'slice and dice' the information. The main challenge will be to design your data correctly. This is a common problem with any business intelligence tool. You will find that you will keep refactoring your data because few people get it right on the first approach.

The basic output of the Pivot Viewer is a special XML schema (CXML). This data (XML) needs to be hosted on a web server with the necessary crossdomain policy files setup. There are two main ways you can generate the data needed for the Pivot viewer.

The first (and easiest) method is to use the provided Excel add-in. This method allows you the enter your necessary information and images. It then allows you to export it in the necessary format which can be hosted on your web server.

The second method requires you to build up the CXML yourself. This can be tricky, but if you use their provided SDK then it should be rather straight forward. The most examples show how to use static deep zoom images. While this is nice when working with images (like the NetFlix example above), using dynamic data will be more tricky. The approach I like to use is to use their SDK and implement my own PivotSource. This is basically a class that implements the CollectionFactoryBase abstract class in their SDK example. You will need to provide implementation for the MakeCollection method.

The next step is to create custom Http Handler to generate the deep zoom image on the fly. They provide a PivotTools library which you can use as a starting point. An alternative method is to create a template image in Blend or PhotoShop which you can inject your values into at run time. There are various APIs you can use to do this.

All of the examples use the local Visual Studio web server to host the solution. There were some interesting problems when trying to host in IIS6 on my Windows 7 machine. A couple of things to keep in mind:
  • Make sure ASP.NET 4 is registered in IIS - use aspnet_regiis -i in command line
  • Make sure MIME types are setup in IIS for text/xml - .cxml, .dzc, .dzi
  • Because you are using custom Http Handlers please make sure that you have Module Mappings setup for the above extensions for IsapiModule. This will tell IIS to execute your registered handlers in the web.config
The rest I will leave up to you to experiment. If you find any other cool features please let me know.

No comments:

Post a Comment