Thursday 14 November 2013

Create a chart using Chart Control of .NET

We need to create chart so many times in the project. I am using chart control of .NET.

Add the chart control from the toolbox just drag and drop in the aspx page it will create following code.

<asp:Chart ID="chtReport" runat="server" Height="500" Width="500">
 <Series>
  <asp:Series Name="Series1" XValueType="Auto" YValueType="Int32">
  </asp:Series>
 </Series>
 <ChartAreas>
  <asp:ChartArea Name="ChartArea1">
   <AxisX Interval="1">
   </AxisX>
  </asp:ChartArea>
 </ChartAreas>
</asp:Chart>


Now feed the data to chart control at the code behind in any event in which you like to bind

List<SPTopTenStudents_Result> ListStudents;
 ListStudents = dbContext.SPTopTenStudents().ToList();
 if (ListStudents != null && ListStudents.Count() > 0)
 {
  Series objseries = new Series();
  foreach (var item in ListStudents)
  {
   objseries.ChartType = SeriesChartType.Column;
   objseries.YValueType = ChartValueType.Int32;
   DataPoint objDS = new DataPoint();
   objDS.SetValueXY(item.Model, item.RequestCount);
   objseries.Points.Add(objDS);
  }
  chtReport.Series["Series1"] = objseries;
  chtReport.DataBind();
 }


when you add chart control it will also create chart handler at web.config file like following.

<appSettings>
<add key="ChartImageHandler" value="Storage=file;Timeout=20;Url=~/Images/;" />
</appSettings>

so create the Images folder if you don't have already in the project.

No comments:

Post a Comment