Chapter 7. SPJS Charts for SharePoint

This solution is a bridge between Google’s Visualization API and SharePoint. This enables you to get data from any SharePoint list or library within the site collection, and create dynamic charts with Google Visualization API.

The solution is used to get the data from the lists and present them to the Google Visualization API in the correct format. The charts are created with the Google Visualization API and therefore all chart-related issues must be checked with the documentation here: http://code.google.com/intl/en-EN/apis/chart/. You will find a link to the relevant configuration options for the selected chart from within the Edit Chart GUI.

This chapter will walk you through the setup of the solution and explain the various settings available in the Edit Chart GUI. It will not go into details about how you can create different charts. You will, however, find chart examples in my private blog, http://sharepointjavascript.wordpress.com.

The solution works in both SharePoint 2007 and 2010.

The technique presented here is entirely client-side and all code and data are processed and rendered in the browser. No data is sent to any server.

The end user does not need to have more than design rights to the site to set it up for the first time. Creating charts after the initial setup can be done with contribute rights.

I have wrapped all code in one file to ease the setup process for the end user. The script-generated HTML that makes up the Edit Chart GUI accounts for the majority of the code lines.

The solution automatically creates the list necessary to store the configuration for the charts. We will use various web service calls to lists.asmx, views.asmx, webs.asmx, sitedata.asmx, and usergroup.asmx to gather the information required to configure the charts in the Edit Chart GUI and to render the charts when they are configured.

The inner workings of the code aren’t discussed in detail here, but the code is commented, so anyone interested can understand it fairly easily.

The actual charts are made using the Google Visualization API, and this solution adds no extra functionality over that provided by Google. This solution may, however, need updates to support new features in upcoming versions of the Google Visualization API. The Google Visualization API team thoroughly tests each new version to ensure backwards compatibility, and I will do my best to keep this solution updated to support new features and fix potentially breaking changes.

SPJS Charts for SharePoint is under continuous development, and anyone can provide feature requests or bug reports. The solution is posted on NothingButSharePoint and in my personal blog, SharePointJavaScript.

The SharePoint integration is licensed by Alexander Bautz under the MIT X11 License. The Google Visualization API Terms of Service can be found at http://code.google.com/intl/en-EN/apis/visualization/terms.html.

The Google Visualization API is loaded dynamically from Google. Under the license agreement, you cannot download the API locally.