Hands-On ASP.NET Core 3.1 : Learn MVC, Razor Pages, Web API, Entity Framework Core, and Blazor. Private online coaching for software developers. Click here to know more.

<%@ Page %>

Creating Bar and Pie Charts in ASP.NET

Introduction

.NET provides many drawing classes via System.Drawing namespace. Prior to ASP.NET it was difficult for an ASP developer to create and emit images (jpg, gif etc.) to the browser at run time. Combining ASP.NET and System.Drawing one can develop attractive charts. This code sample shows how to create bar and pie charts using the technique mentioned above.

What the sample application does?

The sample application draws bar and pie charts for hours spend per day on some fictitious task. The data for X-axis (days) as well as Y-axis (hrs. spend) is stored in an array. The application draws bar and pie graph for the data and saves it to Response.OutputStream. The application consists of three files:
  • BarChart.aspx: This file contains code that generates bar chart for given values
  • PieChart.aspx: This file contains code that generates pie chart for given values
  • ChartHost.aspx: This file contains two image web controls displaying bar and pie chart.

Sample Run

How to run the sample

  • Create a new web application in VS.NET called AspNetCharts
  • Unzip supplied code files in the project folder
  • Add the files mentioned above in the project
  • Run ChartHost.aspx

Bipin Joshi is an independent software consultant, trainer, author, yoga mentor, and meditation teacher. He has been programming, meditating, and teaching for 24+ years. He conducts instructor-led online training courses in ASP.NET family of technologies for individuals and small groups. He is a published author and has authored or co-authored books for Apress and Wrox press. Having embraced the Yoga way of life he also teaches Ajapa Yoga to interested individuals. To know more about him click here.

Get connected : Facebook  Twitter  LinkedIn  YouTube

Posted On : 03 August 2002


Tags : ASP.NET Web Forms .NET Framework


Subscribe to our newsletter

Get monthly email updates about new articles, tutorials, code samples, and how-tos getting added to our knowledge base.

  

Receive Weekly Updates