| There are 4 things you need to do in order to get this configured and working on your machine, remember, however that you will need Visual Studio 2010 and .Net 4. |
|
| I’ll assume you know how to create a Website project…File, New, Website, ASP.Net project… |
| The Web.Config file needs to be modified to contain the httpHandler and controls. These configurations enable the asp:Chart tag which is used in the Default.aspx file. |
<httpHandlers>
<add path="ChartImg.axd" verb="GET,HEAD,POST" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler,System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/></httpHandlers><controls> <add tagPrefix="asp" namespace="System.Web.UI.DataVisualization.Charting" assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/></controls>| In the Default.aspx file we will add the chart, titles, legend, series and chartareas. |
<asp:chart id="Chart1" runat="server" Height="300px" Width="400px">
<titles> <asp:Title ShadowOffset="3" Name="Title1" /> </titles> <legends> <asp:Legend Alignment="Center" Docking="Bottom" IsTextAutoFit="False" Name="Default" LegendStyle="Row" /> </legends> <series> <asp:Series Name="Default" /> </series> <chartareas> <asp:ChartArea Name="ChartArea1" BorderWidth="0" /> </chartareas></asp:chart> | And lastly, we will add the code to the code-behind file to populate and configure the chart. First thing I do is to load the data values for the chart. If this was implemented in a program being used to represent real data, then the values would not be hardcoded. You would connect to a database, run a query and then have your business logic create the contents of the values. For simplicity, I hard coded the values. Then I simply went through and set the properties that created the above Pie Chart. |
protected void Page_Load(object sender, EventArgs e)
{ double[] yValues = { 71.15, 23.19, 5.66 }; string[] xValues = { "AAA", "BBB", "CCC" }; Chart1.Series["Default"].Points.DataBindXY(xValues, yValues); Chart1.Series["Default"].Points[0].Color = Color.MediumSeaGreen; Chart1.Series["Default"].Points[1].Color = Color.PaleGreen; Chart1.Series["Default"].Points[2].Color = Color.LawnGreen; Chart1.Series["Default"].ChartType = SeriesChartType.Pie; Chart1.Series["Default"]["PieLabelStyle"] = "Disabled"; Chart1.ChartAreas["ChartArea1"].Area3DStyle.Enable3D = true; Chart1.Legends[0].Enabled = true;}Hope this help !
