Using the Charting Control in ASP.NET Webform
The following steps will give you a brief intro on how to use the chart control, from there you can easily extend and provide additional functionalities
The chart control has separate definition sections for data and chart type, with this, it is possible to create multiple chart types using the same data points.
- First create a blank asp.net webform
- Then using the design view, click on toolbox and search for the chart control under the data section
- You will now see the placeholder for the chart appear in your webform
- This is the default column chart, you can change the type simply by clicking on the chart and then the arrow that appears
- You can link the data source via standard data adapters like SQL, EF, XML etc. But this example will add the data via code.
Inside the page_load event of the page, add the following code
//Create 6 data points with x values from 1 to 5
for (var x = 1; x < 6; x++)
{
//set it such that the y value mirrors the x value
var y = x;
//add the following point to the chart
Chart1.Series[0].Points.AddXY(x, y);
} - Press F5 to run the website and view your chart