This sample demonstrates how to create a visually stunning Radial Bar Chart with customized center view using the Syncfusion .NET MAUI Charts control.
Radial Bar chart is a type of doughnut chart that represents each segment as a separate circle. Radial Bar Charts are versatile and can be used in various scenarios to visualize categorical data in a circular format. Here are a few common use cases:
- Sales Performance
- Market Share Analysis
- Survey Results
- Performance Metrics
The .NET MAUI Radial Bar Chart offers extensive customization options, with the center view feature being one of its most powerful. This feature allows you to add any view or key statistics to the center of the radial bar chart, making it a useful area for sharing additional information about the chart. In this blog, we will visualize Apple's revenue for 2022, placing an Apple icon and the total revenue in the center view. This central element not only adds a visual appeal but also provides a quick snapshot of the overall data.
The other key features of Radial Bar chart customization include chart features such as chart title, series customization, interaction features, and legends.
With the Syncfusion .NET MAUI Circular Chart, adding a title is simple and intuitive. For our Radial Bar Chart, we've chosen "Apple's Revenue Breakdown for FY 2022." The title of the chart provides quick information about the data being plotted in the chart.
The Syncfusion Circular Chart allows for a customized palette to use distinct colors for each category, making it easier to differentiate between them. Each segment of the radial bar represents a product category, with unique colors assigned to Services, Wearables, iPad, Mac, and iPhone. This use of color coding helps in quick visual identification and comparison of categories.
With the Syncfusion .NET MAUI Radial Bar Chart, there is flexibility to customize the series appearance to suit data presentation needs. Below are the key properties used to enhance the visual appeal of the Radial Bar Chart series:
The CapStyle property adds smooth curves to the start and end of each bar, the Radius property changes the radial bar chart size, and the MaximumValue represents the span of the segment-filled area in the radial bar track. The GapRatio defines the spacing between each segment, and the TrackFill property customizes the circular bar area behind the radial bar segments.
By leveraging these properties, a visually stunning and highly customizable Radial Bar Chart can be created to effectively communicate data insights.
The legend in the Syncfusion Circular Chart provides information about the data points displayed in the circular chart. It lists all categories with their respective icons, making it easy to interpret the data at a glance without needing to hover over each segment.
Syncfusion’s Circular Chart enhances interactivity with tooltips that provide detailed information when a user hovers over or taps on a segment. In this chart, the tooltip shows the category name and its contribution to the total revenue in percentage. This interactivity makes the chart more engaging and informative.
After executing these code examples, we will get the output that resembles the following image.
Path too long exception
If you are facing a path too long exception when building this example project, close Visual Studio and rename the repository to short and build the project.
For a step-by-step procedure, refer to the Radial Bar Chart with customized center view blog post.