DEV Community

Cover image for Getting Started with ASP.NET Core Pie, Pyramid, and Funnel Charts
Arun for Syncfusion, Inc.

Posted on

Getting Started with ASP.NET Core Pie, Pyramid, and Funnel Charts

Learn how to add an Accumulation chart to a Syncfusion ASP.NET Core web application. The Syncfusion ASP.NET Core Accumulation Charts control is designed to visualize data by dividing it into segments and illustrating numerical proportions. You can use it to create various Accumulation Charts, including pie, doughnut, pyramid, and funnel. This video shows how to configure an accumulation chart with titles, legends, data labels, and tooltips.

To add the ASP.NET Core Accumulation charts control to the application, open the NuGet package manager in Visual Studio, open NuGet Package Manager, search for Syncfusion EJ2 Asp Net Core, and install it. You can bind simple JSON data to the chart using the dataSource property in series. Then, map the fields in JSON to xName and yName properties.

In this video, Accumulation Charts are used to visualize the browsers’ usage statistics. To show data points in an accumulation chart, I populate data and connect those data points using a Pie, Doughnut, Pyramid, and funnel series.

A pie chart is used to show the relationship of individual data fields in a series as portions of the total data. It is shaped like a circle divided into colored “slices,” each representing a data value. The area of each slice is proportional to the quantity it represents. Pie charts are commonly used for displaying single-series data.

A doughnut chart is a stylistic variation of a pie chart. It has a circular “hole” in the center, resembling a doughnut. Like a pie chart, it is divided into colored slices, each representing a data value. The area of each slice is also proportional to the quantity it represents.

A pyramid chart is another variation of a pie chart. It is often used when you need to show the hierarchical order of data and its quantity. Each data value is represented by a vertically stacked “slice” of a triangle. The height of each slice is proportional to the quantity it represents. Pyramid charts are useful for visualizing data with a hierarchical structure.

A funnel chart is also derived from the pie chart concept. It is commonly used to show stages where values decrease progressively. Each data value is represented by a vertically stacked “slice” of a triangle, like a pyramid chart. The width of each slice corresponds to its order (e.g., first stage, second stage), but it has no direct relation to its quantity.

Tutorial video: https://www.syncfusion.com/tutorial-videos

Download an example from GitHub: https://github.com/SyncfusionExamples/getting-started-with-the-aspdotnet-core-accumulation-charts-control/

Top comments (0)