1,725 articles and 13,203 comments as of Monday, October 11th, 2010

Friday, June 5, 2009

Case Study: Dynamic Charts in SharePoint, No Code Required!

Note from Mark Miller: Niamh Kenny has used some of the articles here at EndUserSharePoint.com to develop an in-house solution for charts and graphs. She was kind enough to send this overview as a case study of her project.

Niamh KennyGuest Author: Niamh Kenny, London United Kingdom

Niamh is a SharePoint Administrator at Camden & Islington Foundation Trust, London. She has five years of experience working with Microsoft Sharepoint, this includes implementation, training, and customisation.

Case Study – Dynamic Charts in SharePoint: No Code Required!

I have a team site with a Tasks list where all the tasks assigned to the IT Projects Team are kept. They needed a way to report on their tasks etc in a more visual style than the out-of-the-box views!

First I connected the task list to Visio as per diagram below which was great as it gave a really good look to the tasks list and outstanding items.

Dynamic Charts

I use your site a lot to get insights/ideas for quick and easy (generally) solutions to problems or ideas I have had. I also use my test environment to test out and show to end users/managers for approval prior to posting live. I have been following the JQuery sessions for a while. I thought it would be great to have a Pie Chart visually representing the task list, initially for outstanding items with the provision that it could be extended for all types of views, depending on what information the team is either likely to need or want.

So I created the view in the task list, using a calculated column that gave a single line of text that counted either the number of days overdue, how many days were left or whether the task was completed or not and entered that information.  I also made this column count how many of each there were.

Dynamic Charts

Dynamic Charts

I had already found the post http://www.endusersharepoint.com/?p=1537 then created a new page and added the task list as a web part then added the content editor web part including the code for the pie chart. I had previously downloaded the JQuery file from the links and have added that to my top-level site collection that all subsequent sites have access to and can reference.

The final result for this page is here (I haven’t hidden the web-part yet as I think it’s quite good for people to be able to see the actual data too but that may change depending on user requirements).  

Dynamic Charts

I am currently trying to get the multiple charts to work on another page, but am still creating views etc on the task list for that to work.

I have created a Preview Pane for a Calendar using another JQuery from your site and that has gone down as a treat with users as well.  (And took all of 5 minutes too)

Dynamic Charts

 

Please Join the Discussion

13 Responses to “Case Study: Dynamic Charts in SharePoint, No Code Required!”
  1. George W says:

    The images are certainly colorful, but they are too small to see detail. Can they be made larger?

  2. Christophe says:

    The images are small… but big enough to show that the calculated column uses a “Today” that is not in the list of available columns!

  3. Charlotte says:

    I am interested in the taks list and you mention that is it is connected to Visio. How does this connection work? How do you show it in SharePoint is that a Page viewer web part? Or is it not dynamic and is it just a picture? Thank you for the great article.

  4. Christophe says:

    @Charlotte: you can use the Visio viewer to display Visio diagrams in SharePoint pages.

    The data connection is built in Visio. It is not dynamic, you need to open the Visio file and hit refresh to update the data.

  5. Charlotte says:

    Thank you for the quick answer Christophe! Have you maybe written an article about this visio viewer and data connection or maybe a sharepoint colleague wrote an article that i can use as resource? Again, thank you for your answer.

  6. Charlotte says:

    @Christophe. Thank you. Much appreciated. Never even knew about the Visio possibilities. Thnks

  7. Kevin says:

    Is the feature described as “Viewing a SharePoint Task List as a Visio PivotDiagram” a MOSS only capability?

    We use WSS only, and have Visio or Visio viewer loaded on all user computers. I’d love to take advantage of Niamh’s example and tip.

    Wondering if I’m seeing a product limitation or just have a problem w/ my own config.

    Kevin

  8. Christophe says:

    Ian’s demo runs on wss. One limitation is that the viewer only works with Internet Explorer.

  9. Kerrie says:

    How do you get the ‘Create Visio Diagram’ in the Actions menu?

    Does the Visio Viewer have to be installed on all users computers or can it be installed on the SharePoint Server and everyone have access to it?

  10. Christophe says:

    Kerrie, follow the link to the wssdemo site for details.
    Yes, the Visio viewer will run on each user’s computer (like Flash for example).

  11. Andrew says:

    Which version of Visio did you use?

  12. Ian Walters says:

    I am running a SharePoint 3.0 site hosted by Network Solutions and can use the create visio diagram from a task list but not from a project task list.

    The options to export to Excel and Access are still there in the action menu but the visio option is not – is there something I need to “switch on” in the list settings or is it because this is a different type of list?


Notify me of comments to this article:


Speak and you will be heard.

We check comments hourly.
If you want a pic to show with your comment, go get a gravatar!