Leaderboard
🧭 Overview
A leaderboard shows ranking among categories. It consists of a series of bars representing a quantitative metric for comparable entities. This viz allows to quickly benchmark all entities.
📊 Example Use Case
Top-selling products or services
User activity rankings
Department or team performance comparison
Most accessed content or features
Metric-based competition or gamification tracking
⭐ Key Features
Categorize by Bars: Helps compare subgroups independently within the same chart.
Order Bars Within Categories: Enhances readability and comparison inside groupings.
Enable Drill-down: Supports exploratory analysis without leaving the chart context.
Show Rank for Bars: Makes positions explicit without relying solely on visual length.
Configuration
Learn how to create a leaderboard using the new design with this step-by-step guide. Explore the interactive walkthrough below to get started quickly, then dive into the full configuration reference table for in-depth details.
Chart Configuration Step-by-Step
Category
Bar category
The bar category corresponds to a column in your dataset, such as 'Product Type'.
Category by bars
Organizes bars into separate categories or groupings, allowing segmented ranking.
Enable drill-down
Allows users to click on a bar to explore more detailed or related data.
Show rank for bars
Displays a numeric rank for each bar based on its value position.
Value
Bar height
The bar height represents a value from your dataset. You can select an aggregation method from the menu, which may vary depending on the chart type.
Precision
Precision determines the level of detail in how your values are displayed. By default, measures use a .2f format, meaning they are shown with two decimal places.
Example:
A value of 3.14159 will be displayed as 3.14 when using .2f formatting.
Unit
Unit represents the total quantity or category being measured for a KPI. It defines what the values correspond to, providing context for better interpretation.
Sentiment
Four different sentiment statuses (positive, warning, negative, neutral) can be used to color bars, enhancing visual distinction.
Note: Sentiments can be customized in the app theme.
Reverse height order
Inverts the direction of bar heights, so lower values appear higher or vice versa.
Additional parameters
ID
Unique chart Id
Add complementary value
The complementary value is displayed in the data label, providing additional context and making it easier for viewers to interpret the data at a glance. It is possible to add a precision, an unit and a sentiment.
Add user chart guide
Lead your chart viewers through the narrative of your data.
Chart performance
Technical performance
Style Configuration
Bars
Bars
Customize the bar color to align with your branding preferences.
This page provides a step-by-step guide for creating a leaderboard using the legacy design.
*Mandatory parameters
Dataset*
Select the dataset used by the chart
Label*
Your label of choice
Value*
Your value of choice
Legend
Display Legend
Toggle the legend display
Legend
Additional Info
Display contextual in-depth info
Legend
Bar Selected By Default
Select a bar by default
Sort
Sort Bars
Select ascending or descending order
Sort
Display Rank For Sorted Bars
Display the rank of each sorted bars
Variation
Variation
Display a variation badge next to the value based on a column containing the variations
Variation
Variation Legend
Display a legend for your variation
Variation
Hide Empty Variation
Hide variation badge if the value is empty
Groups
Groups
Breakdown labels into groups based on a column containing the groups
Groups
Groups Order
Order group based on a column, on an advanced order or a custom order
Groups
Groups Additional Info
Add a legend to your groups
Groups
Recycle Groups Colors
Reuse groups colors when chart data changes (filters changes for example)
Packs
Packs
Group labels together based on a column
Packs
Display Pack Names
Display or not the packs names
Packs
Packs Order
Order pack based on a column, on an advanced order or a custom order
Drill
Drill
Click on labels and see children details
Drill
Drill Children Order
Order children based on a column, on an advanced order or a custom order
Enrich Chart
Average
Add a vertical average bar based on a value or a column
Enrich Chart
Average Legend
Display a legend for your average bar
Enrich Chart
Additional Values
Display additional values next to the main one (will not be displayed on mobile)
Enrich Chart
Target
Represent target but use it with caution as it is preferable to use the bullet tile to represent targets
Enrich Chart
Sparklines
See the Sparklines section
Display
Scale
Define the bars scale using two bounds
Display
Size
Define the chart size when having multiple ones
Display
Mobile Size
Define the chart size when having multiple ones on mobile
Display
Custom CSS Class
Set a custom CSS class to target this specific chart with CSS
Tutorial
ID
Enter an ID.
Change the ID to display the tutorial again.
All tutorials with the same ID will be displayed only once
Tutorial
Message
Enter your message | This will be displayed to your users
Tutorial
Always display this tutorial
By default the tutorial is shown once only
⭐️ New
Legacy
Bar category
Bars label
Order bars
Labels order
Categorize by bars
Groups
Order bars within categories
Groups order
Reverse bar order
/
Enable drill-down
Drill
Show rank for bars
Display rank for sorted bars
Bar height
Bars value
Line Y-Axis
Y axis
Reverse height order
Sort bars
Add complementary value
Additional info
Add user chart guide
Tutorial
Last updated
Was this helpful?