Documents uploaded Statistics Chart in Silverlight web part

Hi All,

I’m writing a blog almost after an year. I developed a web part a few months ago in Silvelight for the Ministry of Finance, Bahrain. This web part was deployed in to the Document Center sub site of the Intranet portal. So, now you should have guessed that this web part must have something related to the document libraries.

Yes, This web part was developed to show the number of documents in each document library in the sub site in which it is deployed in. The number of documents are shown in a column chart provided by Visifire.

I have used Client Object Model that is available in SharePoint 2010 in order to access the SharePoint data in Silverlight.


As shown in the above screenshot the chart gets display with the document library name (shorter form, you can see the full name when you hover over the columns) and the number of documents get displayed at the top of each column.

Let us look at the coding to develop this web part.

1. Create a Silverlight a Project.

2. Add a reference to the visifire dll.

3. Add the following 2 namespaces to your code file.

  • using Visifire.Charts;
  • using Visifire.Commons;

4. Now add reference to the following Silverlight client object model dlls.

  • a. Microsoft.SharePoint.Client.Runtime.
  • b. Microsoft.SharePoint.Client.Silverlight.Runtime.
The above 2 dlls are available in the following path C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\ClientBin
5. Add the following namespace to the code file.
  • using Microsoft.SharePoint.Client;
6. Declare all the variables that are going to be used.
        ClientContext ctx;
        Web web;
        ListCollection listcoll;
        IEnumerable<List> NonHiddenLists;
        private IEnumerable<ListItem> listItems = null;
        private delegate void UpdateUIMethod();

7. In the MainPage constructor, write the following coding to retrieve all the SharePoint lists which are of type document library, present in the Quicklaunch, and are not hidden.

       public MainPage()
            ctx = ClientContext.Current; //geting the current context
            web = ctx.Web; //loading the current web
            listcoll = ctx.Web.Lists; // getting the list collection from the web
            // getting the lists which are Doc. Liba nd not hidden and are on Quicklaunch
            NonHiddenLists = ctx.LoadQuery(
                .Where(list => !list.Hidden &&
                      list.BaseType == BaseType.DocumentLibrary && list.OnQuickLaunch == true && list.LastItemModifiedDate >= dt));
            ctx.ExecuteQueryAsync(onQuerySucceeded, null); // executing it asynchronously

      private void onQuerySucceeded(object sender, ClientRequestSucceededEventArgs args)
            UpdateUIMethod updateUI = DisplayInfo;

8. Now, in the DisplayInfo function let us retrieve the name of the document library and the number of documents in the document library (i.e. is the Item Count) from the NonHiddentLists IEnumerable collection using LINQ Query as shown below.

      private void DisplayInfo()
           var details = from list in NonHiddenLists
                       where list.ItemCount > 0
                       select new { listName = list.Title, Count = list.ItemCount };

9. Now, let us loop through each each item in the above formed “details” collection to create a DataPoint and add it to a DataSeries to bind it to a Visifire chart as shown below

            Chart chart = new Chart();

            chart.Width = 400;
            chart.Height = 200;

            chart.View3D = false;
            Title title = new Title();
            chart.ToolTipEnabled = true;
            title.FontWeight = FontWeights.Black;
            title.Text = "Document Library Statistics";
            title.VerticalAlignment = VerticalAlignment.Bottom;

            DataSeries ds = new DataSeries();

            ds.LabelEnabled = true;
            ds.RenderAs = RenderAs.StackedColumn;

            // looping the items in the ListDetails class and creating a DataPoint and adding it to a DataSeries
            foreach (var data in Details)
                DataPoint dp = new DataPoint();
                dp.AxisXLabel = data.List;
                dp.YValue = data.Count;
                dp.Cursor = Cursors.Hand;


10. Add the above created chart to the LayoutRoot Grid as shown below.