Getting Started with .NET Sunburst Chart for WPF, WinForms, and UWP
As we continue leading the way on the latest data visualization trends, we're happy to announce the addition of a .NET Sunburst chart, a modern chart that lets you visualize hierarchical data beyond the classical bars and circles. Sunburst is the newest chart available with our FlexChart chart control.
About Sunburst Charts
One of the latest charts in the industry, Sunburst is a natural evolution of Pie that produces beautiful visualization and provides deeper analysis capabilities. It's as easy to use as a pie chart, and Sunburst charts are a great way to visualize hierarchical data using a radial layout (as opposed to the TreeMap). Sunburst chart in FlexChart is an extension of the already available FlexPie control, with each level of the hierarchy represented by a ring. The innermost ring depicts the beginning of the hierarchy and deeper levels are layered around it; individual rings are sliced and divided based on their hierarchical relationship to the parent slice as shown in the figure below. 
Sunburst chart In this blog we'll look at:
Why Sunburst?
Before we begin, let’s take a small data set for our data visualization example.
Year
Quarter
Month
Sales
2014
Q1
120
2014
Q2
250
2014
Q3
160
2014
Q4
190
2015
Q1
Jan
45
2015
Q1
Feb
50
2015
Q1
March
55
2015
Q2
175
2015
Q3
170
2015
Q4
Oct
70
2015
Q4
Nov
65
2015
Q4
Dec
40
You'll notice that there's a hierarchical pattern in the data. Traditional charts such as Column, Bar or Pie are not an ideal candidate to plot such data because of their inability to visualize the multi-level hierarchy in a single chart. Yes, you can add some drilldown mechanism or use multiple charts, but what if the hierarchy goes deeper? There will be a limitation to these workarounds. Designed specifically to cater scenarios like these, Sunburst chart is an ideal solution to visualize this multi-level hierarchical data. The main purpose is to help the end user visualize how an outer layer (child member) contributes to an inner layer (parent).
Getting Started with our .NET Sunburst chart
To get started with the Sunburst chart:
- Place the Sunburst control on the designer surface
Specify the chart’s data source
sunburst.DataSource = ds.SalesCollection;Set the chart’s Binding to the property name that contains the values to be plotted
sunburst.Binding = “Sales”;Set the chart’s BindingName to the property name that contains the name of data items. This should be a comma-separated string.
sunburst.BindingName = “Year,Quarter,Month”;
The sequence in the comma-separated string above is very important as it determines the sequence for the sunburst layers. In the above case “Year” would be the innermost layer, followed by “Quarter” and then “Month”.
- Next, set the chart’s ChildItemsPath to the property (or properties) name used to generate child items in hierarchical data.
sunburst. ChildItemsPath = “Items”;
That’s all you’ll need to do. The last step is not required if the data you are using is flat in nature. We’ll get into the differences between using flat and hierarchically structured data with Sunburst chart in our next blog.
Customizing Sunburst chart
Since it's inherited from FlexPie, Sunburst chart offers the same level of customization. You can use properties like InnerRadius, Offset, StartAngle, and Palette to customize the layout and appearance of Sunburst chart. Here's how those properties look in code:
sunburst.InnerRadius = 0.3;
sunburst.Offset = 0.02;
sunburst.StartAngle = 180;
sunburst.Palette = Palette.Modern;
Customized sunburst chart In this blog we covered the basics of Sunburst chart: what's the usage, how to get started and customization. In the subsequent blogs, we will walk you through how you can take maximum advantage of current as well as upcoming functionalities of Sunburst chart. Download the Sunburst101 Sample: Win | WPF | UWP Read more about Sunburst: Win | WPF | UWP
GrapeCity