KPI Card

KPI Cards

1.1 Use Cases

1.2 Chart Configuration

1.2.1 Axis Data

• Dimensions: 0 dimensions
• Metrics: 1-30 metrics

1.2.2 Styling (Web)

1.2.2.1 Basic Info

• Chart Name: Defaults to the analysis Subject name during creation. Can be customized during chart configuration.

• Notes:
  • Note Content: Add contextual notes to help viewers better understand the chart.
  • Note Display Styles:
    • Collapsed: Appears as an icon next to the chart title in both detail and card views. Hover to reveal the note.
    • Expanded: Displays the note text directly below the chart title.
    • Hidden: Notes are not shown in either view.

Adding note content

Collapsed note display

Expanded note display

Hidden note display

• Metric Name: Displays the metric name by default. Customizable.

1.2.2.2 Visual Display

• Layout: Defaults to Layout 1. Switchable to other layouts.

• Layout 1: Two metrics grouped side-by-side.

• Layout 2: Two metrics stacked vertically.

• Layout 3: Three metrics grouped with two above and one below.

• Layout 4: Three metrics grouped with one above and two below.

• Layout 5: Four metrics grouped in a 2x2 grid.

• Layout 6: Ungrouped display.

• Advanced Layout: Supports custom icons per metric.

• Custom Layout:
  • Layout Types: Tile, 1-to-1, 1-to-2, 1-to-4, 1-to-6, 1-to-8. Tile layout mirrors the Advanced Layout but offers richer customization.
  • Styling Options:
    • Cards per row (Tile excluded)
    • Card spacing
    • Font size for metrics and labels
    • Primary/secondary metric positioning (left/right/top/bottom; Tile excluded)
    • Column count and spacing (Tile excluded)
    • Divider line style (weight, type, color; Tile excluded)
    • Alignment (left/center/right)
    • Icon customization (size, type, color, border)
    • Preset color schemes
    • Card borders (color, weight)
    • Corner radius

Tile layout

1-to-1

1-to-2

1-to-4

1-to-6

1-to-8

1.2.3 Styling (Mobile)

1.2.3.1 Inherit Web Layout

• Mirrors the Web layout settings. Not configurable separately.

1.2.3.2 Independent Layout

• Defaults to Web settings but allows mobile-specific adjustments.
  • Fewer options than Web. Non-configurable items inherit Web settings.