Sunday, January 20, 2008

SharePoint Survey Results using Pie chart

SharePoint out of the box survey results are shown in bar chart. We can easily show it in pie chart using charting tools. Code snippet below shows how we can show survey results in a pie chart using Telerik chart controls (www.telerik.com). Survey resutls will be rendered as a webpart shown below:


Below code snippet renders SharePoint survey results as Pie chart using Telerik chart control:

using System;
using System.Collections.Generic;
using System.Text;
using System.Web;
using System.Drawing;
using System.Runtime.InteropServices;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Serialization;
using System.Web.UI.HtmlControls;
using Microsoft.SharePoint;
using Microsoft.SharePoint.WebControls;
using Microsoft.SharePoint.WebPartPages;
using Telerik.WebControls;
using Telerik.Charting;
using Telerik.WebControls.Dialogs;


namespace CommonControls.Survey
{
[Guid("ce0403df-d85c-4ba0-9b57-f944fb70ded4")]
public class SurveyChart : Microsoft.SharePoint.WebPartPages.WebPart
{
List<Response> response;
String surveyQuestion;
RadChart chart;


public SurveyChart()
{
this.ExportMode = WebPartExportMode.All;
}

protected override void RenderContents(HtmlTextWriter htmlTextWriter)
{
htmlTextWriter.Write("<TABLE><TR><TD>");
this.chart.RenderControl(htmlTextWriter);
htmlTextWriter.Write("</TABLE></TD></TR>");
}

protected override void CreateChildControls()
{
string[] colors = { "#FFDA43", "#2F89C2", "#F267CD", "#79E364", "#EB5D2D", "#42AE18", "#FF9C40", "#B99A72", "#9BC0FF", "#98CC88", "#C3B600" };
chart = new RadChart();
chart.UseSession = false;
chart.TempImagesFolder = "~/_layouts/temp";
chart.RadControlsDir = "~/_layouts/radcontrols/RadControls/";

ChartSeries chartSeries = new ChartSeries();
chart.AddChartSeries(chartSeries);
ChartTitle title = new ChartTitle();


ChartSeries series = chart.GetChartSeries(0);
series.Name = surveyQuestion;

chart.Legend.HAlignment = ChartHAlignment.Center;
chart.Legend.VAlignment = ChartVAlignment.Bottom;
chart.Legend.LegendStyle = LegendItemsPositionType.Row;


response = GetSurveyResponse("http://server/sites/techresources/", "http://server/sites/techresources/Lists/Survey2");
title.Text = surveyQuestion;
title.TextFont = new Font("Verdana", 7);
chart.Chart.ChartTitle = title;

series.Clear();
series.DiameterScale = 0.40;
series.ShowLabelConnectors = false;
series.ShowLabels = true;
series.LabelAppearance.Distance = 7;
series.LabelAppearance.TextFont = new Font("Verdana", 7);
series.NotOverlapLabels = true;
series.Type = ChartSeriesType.Pie;
ColorConverter cc = new ColorConverter();
int i = 0;
foreach (Response res in response)
{
ChartSeriesItem seriesItem = new ChartSeriesItem();
seriesItem.YValue = res.totalResponse;
seriesItem.ItemMap.ToolTip = res.choiceName;
seriesItem.Label = res.totalResponse.ToString();
seriesItem.Appearance.MainColor = (Color) cc.ConvertFromString(colors[i++]);
seriesItem.Appearance.BorderColor = Color.DimGray;
seriesItem.Appearance.FillStyle = FillStyle.Solid;
seriesItem.Name = res.choiceName;
series.Items.Add(seriesItem);
}
chart.Skin = "LightGreen";
this.Controls.Add(chart);
}

public List<Response> GetSurveyResponse(string siteUrl, string surveyName)
{

List<Response> responseList;
string questionName = "";
using (SPSite oSPSite = new SPSite(siteUrl))
{
using (SPWeb oSPWeb = oSPSite.OpenWeb())
{
SPList surveyList = oSPWeb.GetList(surveyName);
if (surveyList.BaseType != SPBaseType.Survey)
throw new Exception("List is not of survey type");
responseList = new List<Response>();
foreach (SPField field in surveyList.Fields)
{
if (field.Type == SPFieldType.Choice)
{
SPFieldChoice choiceField;
choiceField = (SPFieldChoice)field;
questionName = field.StaticName;
surveyQuestion = field.Title;
foreach (string choiceName in choiceField.Choices)
{
Response resField = new Response();
resField.choiceName = choiceName;
responseList.Add(resField);
}
}
}
foreach (Response res in responseList)
{
SPQuery responseQuery = new SPQuery();
responseQuery.Query = @"<Where>
<Eq><FieldRef Name=" + questionName + " /><Value Type=\"Choice\">" + res.choiceName + @"</Value></Eq>
</Where>";
res.totalResponse = surveyList.GetItems(responseQuery).Count;
}
}
}
return responseList;
}
}
}

8 comments:

Anonymous said...

Is there a way to display sharepoint list as graph? What I mean is to create a graph with sharepoint list as data source and display the graph in the sharepoint site.

Sridhar said...

You could display lis items as graph using some 3rd party charting tools. You can also use SQL Server reporting service which can take List as its data source.

ragava said...

is it possible to make the data source for this pie chart as list(columns of the list)?any idea related to it

heena said...

is it possible to have dropdown box and have that dropdown box connected to database?

Anonymous said...

hi,
i would also like to learn how to put this coding in sharepoint page. i am totaly new the computer world please teach me how to put c# coding in sharepoint.
Thank you

Anonymous said...

What is Response object in this example?

Anonymous said...

Hi Sridharu,

You are using a response object. Can you share that code?

Anonymous said...

Use Rad chart, Sharepoint List - Access through the object model ; fetch as a datatable and assign as datasource to radchart.

To see in the webpart host it on smartpart.