Click here to Skip to main content
12,305,299 members (74,169 online)
Click here to Skip to main content
Add your own
alternative version

Stats

119.6K views
6.1K downloads
55 bookmarked
Posted

Working With Silverlight PivotViewer

, 15 Aug 2010 Ms-PL
Rate this:
Please Sign up or sign in to vote.
What is Silverlight Pivotviewer and how to connect it to your Silverlight application

Introduction

What’s Silverlight PivotViewer?

Pivot makes it easier to interact with massive amounts of data in ways that are powerful, informative, and fun. Microsoft Live Labs tried to step back and design an interaction model that accommodates the complexity and scale of information rather than the traditional structure of the Web.

Before Getting Started –> Things You Need To Know

System Requirements:

  • Recommended: Windows 7 with Aero enabled, 2-GHz 32-bit (x86) processor, 2 gigabytes of random access memory.
  • Supported: Windows Vista with Aero enabled, 2-GHz 32-bit (x86) or 64-bit (x64) processor.
  • Minimum Graphics Requirements: 256 megabytes of video memory.
    Pivot does not support most Intel integrated video chipsets.
  • Pivot only displays in English (US).
  • Pivot requires .NET Framework 3.5 SP1 and Internet Explorer 8.

Here you can download Microsoft Silverlight PivotViewer.

Background

Massive amounts of data is something we see more every day, there are too many sites with massive amount of data that makes our surfing experience unbearable.

Microsoft Live Labs just released "PivotViewer" control for Silverlight, a control that will make it easier to interact with massive amounts of data in ways that are powerful, informative, and fun.

Step 1 - Creating a Collection

Collections combine large groups of similar items on the internet, so we can begin viewing the Web as a "web" rather than a series of isolated pages. As a developer, you can create collections of your own. New collections can be created with no code – they’re only data.

Collections are composed of two parts:

  • XML – The items in the collection are described in XML, in a ".cxml" file.
  • Images – The images in the collection are described in Deep Zoom format.

To create our collection, we can use two wonderful tools – those tools will help you in creating the collections without writing even one line of code!

  1. Pivot Collection Tool for Microsoft Excel
  2. Pivot Collection Tools for the Command Line
  3. Sample Code for Creating Just in Time Pivot Collections

For my demo, I'll first use Microsoft Excel Collection Tool to create my collection, so after you have downloaded Excel Tool open Excel and open the new “Pivot Collections” tab and click “New Collection”.

A new workbook will be created containing several columns:

  • Image Location- Location of the original image for an item. Publishing will generate Deep Zoom files from this image, but will not modify the original image. The higher resolution the image, the better.
  • Name- Name of the item. It will appear at the top of the info panel in Pivot.
  • Href- A URL associated with this item. Double-clicking the item in Pivot will navigate the user to this URL.
  • Description- Description of the item. The description will appear near the top of the info panel in Pivot.

Step 2 - Add Items

Once you have created the new collection, you want to start adding items to your collection, you can do it in two ways:

  1. Choose Image” – button will allow you to add a single image
  2. Import Images” – button will allow you to add several images at once

After you added all your items, you can start adding additional information like Name, Link and Description of the Item.

Step 3 – Preview

Under “Pivot Collections” tab, click “Quick Preview”, you will notice “Pivot Viewer” will appear with your collection (you should not see images in the preview mode) including the information you have entered.

Step 4 – Add Filters To Collection

In the beginning, we talked about what’s Pivot - Pivot makes it easier to interact with massive amounts of data in ways that are powerful, informative, and fun, How?

To enable easy, informative and powerful search of your items, we need to add Filters (a.k.a. Fact) to our collection, go back to the Excel file and add more columns like – Rank, Subject, Track and add the correct values.

To put multiply values in the same category, you can Separate the values with ‘||’.

How Those Filters Look Like Under the Hood?

Step 5 – Add Collection Properties

Before hosting your application, please make sure you enter the below information:

Step 6 – Publish

After you have finished editing all the information regarding the collection, just publish it to create the collection.

To share the collection with others, copy the ".cxml" file, the images directory, the most recently modified ".xml" file, and the most recently modified directory. The ".xml" file and the directory should have matching names. All other ".xml" files and directories can be deleted.

  • A ".cxml" file - This is the main file containing your collection. For example, "Photos.cxml".
  • A directory of image files - This directory contains the images in your collection. For example, "Photos_files". This directory contains:
    • A directory called "images" – This directory contains image files for your collection.
    • A number of ".xml" files and directories - These files and directories are generated every time a collection is published, but you'll only need the ones from the last time you published. Their names are generated randomly. For example, a file might be called "1c3a2fl3.w1s.xml" and a directory might be called "1c3a2fl3.w1s_files".

Step 7 - Adding PivotViewer to Your Silverlight Application

  1. Create a new Silverlight Application
  2. Add a reference to “System.Windows.Pivot.dll” located under
    C:\Program Files (x86)\Microsoft SDKs\Silverlight\v4.0\PivotViewer\Jun10\Bin\
  3. Add Pivot namespace to your XAML file –>
    xmlns:pivot="clr-namespace:System.Windows.Pivot;assembly=System.Windows.Pivot"
  4. Add Pivot Viewer Control
     <!-- The PivotViewer control -->
    <pivot:PivotViewer Name="PivotViewerControl" Grid.Column="0"
                       ItemDoubleClicked="PivotViewerControl_ItemDoubleClicked">
    </pivot:PivotViewer> 
  5. Add collection .cxml file and the files folder to your ClientBin (or if you want, you can upload all under hosting service).
  6. Load collection using this method - PivotViewerControl.LoadCollection(MauritiusCollectionUri, "");
  7. I've added an event for double clicking on Collection Items, so when you double click, a new browser will open with the item link.
  8. You're done!

More Silverlight PivotViewer Examples

License

This article, along with any associated source code and files, is licensed under The Microsoft Public License (Ms-PL)

Share

About the Author

Shai Raiten
Architect Sela
Israel Israel
Shai Raiten is VS ALM MVP, currently working for Sela Group as a ALM senior consultant and trainer specializes in Microsoft technologies especially Team System and .NET technology. He is currently consulting in various enterprises in Israel, planning and analysis Load and performance problems using Team System, building Team System customizations and adjusts ALM processes for enterprises. Shai is known as one of the top Team System experts in Israel. He conducts lectures and workshops for developers\QA and enterprises who want to specialize in Team System.

My Blog: http://blogs.microsoft.co.il/blogs/shair/

You may also be interested in...

Comments and Discussions

 
Questiongetting xmal parser exception in Silverlight PivotViewer Pin
usha sri latha16-Oct-13 22:50
memberusha sri latha16-Oct-13 22:50 
QuestionError While Adding Pivot Control To SilverLight Page. Pin
nirajzambad26-Jul-12 3:09
membernirajzambad26-Jul-12 3:09 
AnswerRe: Error While Adding Pivot Control To SilverLight Page. Pin
nirajzambad26-Jul-12 19:40
membernirajzambad26-Jul-12 19:40 
Questionhttp://www.imagesurf.net Pin
iimagegrapher23-Nov-11 19:15
memberiimagegrapher23-Nov-11 19:15 
GeneralMy vote of 5 Pin
Bill SerGio, Infomercial King5-Jul-11 9:31
memberBill SerGio, Infomercial King5-Jul-11 9:31 
GeneralMy vote of 1 Pin
Bill SerGio, Infomercial King29-Jun-11 7:51
memberBill SerGio, Infomercial King29-Jun-11 7:51 
GeneralRe: My vote of 1 Pin
Shai Raiten30-Jun-11 3:40
memberShai Raiten30-Jun-11 3:40 
GeneralRe: My vote of 1 : why I downvoted you Pin
phil.o19-Oct-11 0:52
memberphil.o19-Oct-11 0:52 
QuestionGreat article... Pin
DaveSF0828-Jun-11 6:21
memberDaveSF0828-Jun-11 6:21 
AnswerRe: Great article... Pin
Shai Raiten30-Jun-11 21:31
memberShai Raiten30-Jun-11 21:31 
QuestionSilverlight Page fail to initialize. [modified] Pin
King Coffee3-Apr-11 16:55
memberKing Coffee3-Apr-11 16:55 
GeneralMy vote of 3 Pin
GuruprasadV24-Mar-11 5:49
memberGuruprasadV24-Mar-11 5:49 
GeneralMy vote of 1 Pin
VickyC#17-Nov-10 1:36
memberVickyC#17-Nov-10 1:36 
GeneralRe: My vote of 1 Pin
Shai Raiten16-Jan-11 9:38
memberShai Raiten16-Jan-11 9:38 
GeneralMy vote of 1 Pin
VickyC#15-Nov-10 17:25
memberVickyC#15-Nov-10 17:25 
GeneralRe: My vote of 1 Pin
Shai Raiten16-Jan-11 9:43
memberShai Raiten16-Jan-11 9:43 
GeneralRe: My vote of 1 Pin
VickyC#19-Feb-11 18:12
memberVickyC#19-Feb-11 18:12 
GeneralRe: My vote of 1 Pin
Shai Raiten2-May-11 20:47
memberShai Raiten2-May-11 20:47 
GeneralRe: My vote of 1 Pin
VickyC#24-Oct-11 15:34
memberVickyC#24-Oct-11 15:34 
QuestionPivotviewer Hosting Setup Pin
truefocus15-Nov-10 4:07
membertruefocus15-Nov-10 4:07 
GeneralMy vote of 5 Pin
thatraja5-Oct-10 20:58
memberthatraja5-Oct-10 20:58 
GeneralXP Pin
sblunsden15-Aug-10 23:01
membersblunsden15-Aug-10 23:01 
GeneralRe: XP Pin
Shai Raiten15-Aug-10 23:49
memberShai Raiten15-Aug-10 23:49 
GeneralPlease Clarify Windows XP not supported Pin
Shashank Banerjea4-Aug-10 6:46
memberShashank Banerjea4-Aug-10 6:46 
GeneralRe: Please Clarify Windows XP not supported Pin
Shai Raiten15-Aug-10 23:49
memberShai Raiten15-Aug-10 23:49 
GeneralWorking With Silverlight PivotViewer Pin
Member 165621414-Jul-10 5:51
memberMember 165621414-Jul-10 5:51 
GeneralRe: Working With Silverlight PivotViewer Pin
Shai Raiten14-Jul-10 6:00
memberShai Raiten14-Jul-10 6:00 
GeneralMy vote of 5 Pin
KunalChowdhury9-Jul-10 22:48
mentorKunalChowdhury9-Jul-10 22:48 
GeneralRe: My vote of 5 Pin
Shai Raiten10-Jul-10 17:47
memberShai Raiten10-Jul-10 17:47 
QuestionPivot does not support most Intel integrated video chipsets? Pin
sgwong9-Jul-10 20:40
membersgwong9-Jul-10 20:40 
AnswerRe: Pivot does not support most Intel integrated video chipsets? Pin
Shai Raiten10-Jul-10 17:40
memberShai Raiten10-Jul-10 17:40 
GeneralGreat... Pin
cassio.scherer5-Jul-10 3:13
membercassio.scherer5-Jul-10 3:13 
GeneralRe: Great... Pin
Shai Raiten5-Jul-10 9:00
memberShai Raiten5-Jul-10 9:00 
GeneralMicrosofts examples Pin
RugbyLeague4-Jul-10 22:44
memberRugbyLeague4-Jul-10 22:44 
GeneralRe: Microsofts examples Pin
Shai Raiten5-Jul-10 1:01
memberShai Raiten5-Jul-10 1:01 
GeneralNice, thanks for sharing Pin
Alan Beasley4-Jul-10 22:36
memberAlan Beasley4-Jul-10 22:36 
GeneralRe: Nice, thanks for sharing Pin
Shai Raiten5-Jul-10 0:59
memberShai Raiten5-Jul-10 0:59 
QuestionHow to open solution Pin
RugbyLeague4-Jul-10 22:17
memberRugbyLeague4-Jul-10 22:17 
AnswerRe: How to open solution Pin
Shai Raiten5-Jul-10 1:03
memberShai Raiten5-Jul-10 1:03 

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Praise Praise    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

| Advertise | Privacy | Terms of Use | Mobile
Web01 | 2.8.160530.1 | Last Updated 16 Aug 2010
Article Copyright 2010 by Shai Raiten
Everything else Copyright © CodeProject, 1999-2016
Layout: fixed | fluid