KPI Tile
A KPI (Key Performance Indicator) Tile Chart displays measurable values that indicate how effectively a company is achieving its key business objectives. It provides an at-a-glance summary of prominent trends, indicators, and values based on business metrics.
The KPI Tile component combines:
Primary/Secondary metrics for comparison.
Trend indicators (positive, negative, or neutral).
Sparkline visualization for historical progression.
By consolidating multiple indicators into one component, KPI Tiles reduce dashboard clutter and improve performance monitoring efficiency.
Best Situations to Use
Use KPI Tiles when you need to:
Provide real-time business performance insights in a compact format.
Track progress against targets quickly.
Reduce the number of dashboard components by combining multiple indicators.
Present leading metrics (trends) and lagging metrics (values) together.
Examples:
Displaying Revenue vs. Target with positive/negative trend indicators.
Monitoring Customer Satisfaction (CSAT/NPS) scores over time.
Showing Sales pipeline progression alongside Sparkline history.
Variations
KPI Tiles can be displayed in multiple formats:
Sparkline Only – Shows a small trendline.
Trend Only – Displays upward, downward, or flat indicators.
Sparkline with Trend – Combines both for richer context.
Properties
General
Component Name – Auto-generated unique identifier.
Position (Left, Top) – Placement on the canvas.
Height / Width – Define component dimensions.
Initial Visibility – Toggle visibility on load.
Tooltip – Show contextual information on hover.
Direction – Choose horizontal or vertical orientation.
No. of Rows/Columns – Define layout structure (e.g., 5 rows/columns).
+ve Trend Color – Define color for positive trends.
-ve Trend Color – Define color for negative trends.
Zero Trend Color – Define color for neutral trends.
Sparkline Color – Border color of the Sparkline.
Sparkline Fill Color – Fill color of the Sparkline.
Background & Style
Category Text Styling
Font Color, Size, Style, Weight, and Family customization.
Primary Series (Main KPI)
Font Color, Size, Style, Weight, and Family customization.
Secondary Series (Comparison KPI)
Font Color, Size, Style, Weight, and Family customization.
Dataset Indicator Properties
Configure which dataset fields map to:
Primary Series
Secondary Series
Sparkline
Trend
Example Use Cases
Executive Dashboards: Track company-wide KPIs like Revenue, Profit, and Customer Growth.
Sales: Monitor lead conversion rates with historical sparkline data.
Operations: Visualize efficiency metrics with trends to highlight improvements or risks.
HR Analytics: Track attrition rates or hiring vs. target over time.
Sample Data Setup:
Category Field: Value Field (KPI identifier).
Series Fields: Primary Series (main KPI) and Secondary Series (comparison metric).
Indicator Fields: Sparkline and Trend columns.
⚠️ Note:
Be sure to configure No. of Rows/Columns in General Properties to align with the dataset.
Example: If you want 5 KPI Tiles visible, set Rows/Columns = 5.