Display SharePoint data in chart

I had a requirement to display Tasks Status from SharePoint in a pie chart. We can do this in several ways; in this post will explain about using REST API and Google charts to display your data.

Everyone is familiar with Tasks list and very commonly used in SharePoint .Status field in this list has below options and would like to display my chart based on this status.

·         Not Started

·         In Progress

·         Completed

·         Deferred

·         Waiting on someone else

SharePoint 2010 had WCF data service that gives REST interface. Using this we can query on SharePoint data.

URL: -  <Site URL >/_vti_bin/ListData.svc

Steps:

1.       Get count of each status by using below query  on Task list

<Site URL>/_vti_bin/ListData.svc/Task/$count?$expand=Status&$filter=Status/Value eq 'Not Started'

2.       Build array of all status with count as shown in code html.

3.       Use google API to create Pie chart

4.       Upload this html and add as a CEWP.

 

 

Source Code :

Output :