The Radial Chart element provides an effective display, particularly for ratio, performance, and comparison-focused analyses, by visualizing data on a circular axis. With categories placed along the radial axis, the value for each category is represented as a bar/slice extending outward from the center of the circle. This structure allows users to quickly interpret the relationships, ratios, and rankings between different categories in the data set.
(i) The Radial Chart element is supported in both web and mobile applications.
1.1. Common Use Cases
Displaying category-based performance metrics (e.g., department performance scores, product-based ratings)
Presenting ratios and percentages in a circular arrangement (e.g., target achievement percentages, distribution ratios)
Visually comparing different categories. Data comparison becomes intuitive thanks to categories arranged along the circle.
Analyzing the overall situation and ranking at a glance. The highest and lowest values are easily identified.
Use the radial bar structure to visualize trends or levels. (e.g., capacity ratio, success rate, rating levels)
2. Key Features
Category-based data display with a circular bar structure. Each category is placed on the circle and represented by a bar/slice extending outward according to its value.
Ideal structure for proportional data analysis. Each category can be compared based on percentage or score values.
Simultaneous comparison for multiple categories. All categories are displayed on the same reference plane on the circle.
Dynamic loading support from the data source. Current data can be automatically retrieved using SQL, REST API, or Managed DB actions.
Customizable category names and values. Tag color, font, and position can be adjusted.
2.1. Element Settings (Properties)
When you select the Radial Chart element, you can define data sources, levels, slice labels, percentage values, and line/style configurations in detail via the Properties panel on the right. All settings are explained item by item below.
Options (General Data Settings)
Actions: Defines the SQL actions that bring the categorical data to be displayed on the Radial Chart. One or more actions can be used as the data source.
Slice Label Field: Specifies the category label to be displayed on each slice. E.g.: “Sales,” “Performance,” “Capacity.”
Slice Text Field: Defines the text to be displayed inside the slices. Can be used as an additional explanation, short description, or value representative.
Percentage Field: Specifies the percentage value to be displayed in the slice. Represents the share of each slice in the total.
Point Field: Defines the values of specific points on the chart. Used to highlight specific data points, especially in multi-level or multi-point radial structures.
Levels
This area is used to configure the rings/levels within the Radial Chart.
Level Label Field: Defines the labels to be displayed on the level circles. E.g.: “Low,” “Medium,” “High.”
Level Text Field: Defines the text to be displayed inside each level. Can be used for level descriptions, category summaries, or additional information.
Level Percentage Field: Displays the percentage of each level within the total. Expresses the relative size of the levels.
Level Color Field: Defines the color palette for the levels. A different color can be assigned to each level, or single color variations can be used.
Line and Color Settings
Line Color: Determines the color of the main lines that form the radial chart. Used to customize the appearance of the circle lines and level contours.
Line Width: Sets the line thickness in the range of 1–8. Thicker lines provide a more prominent appearance, while thinner lines provide a more minimal appearance.
Radial Line Color: Determines the color of the radial lines extending outward from the center of the chart. Controls the visibility of the “spider web” lines that align the data points.
Background Color: Customizes the chart background color. Used to create a dark mode, light mode, or brand-themed appearance.
Legend Text Color: Determines the color of the text in the legend area. This is important for improving category readability in charts that use multiple slices or levels.
2.2. Actions That Can Be Added to Elements
Since the Radial Chart element is purely a visual data display component, it does not support triggering actions through user interaction. Therefore, when the element is selected, the ADD ACTION button is not visible and no trigger can be assigned to the chart.
Basic principles regarding action behavior:
Clicking, hovering, or selecting the Radial Chart does not trigger an action.
Updating the chart data is achieved by triggering SQL actions in the Datasource / Actions field linked to the Radial Chart by external UI elements.
If the chart needs to change based on user selections (e.g., year selection, category filter, user selection), this behavior is achieved by adding actions to elements such as Button, Radio Group.
The Radial Chart only displays data; it does not initiate any actions on its own.
Actions cannot be added to the Radial Chart; all data updates are managed by external actions.
3. Common Properties
Some areas on the Radial Chart element are common to all UI elements. Therefore, detailed explanations of the following properties can be found in the relevant general guide pages: