Home Components Support Pricing About Log in

Bullet Chart

BptChartBullet

Bullet chart (Stephen Few) — a compact horizontal layout showing an Actual measurement against a Target, with optional qualitative bands (poor / satisfactory / good) shaded behind the bar. Designed to replace gauges and dials. Built on the BPT chart foundation — palette-aware, drag-to-rotate in 3D mode, scroll-zoom, and keyboard-accessible via a hidden data table.

Bullet Chart Parameters

Quarterly KPI dashboard
Metric	Actual	Target
Revenue ($k)	480	500
New users	1320	1500
NPS	62	55
Churn (%)	4.2	4
CSAT (%)	87	90

Current Configuration

📋

<BptChartBullet Data="@Data"
                Width="640"
                Height="320"
                Title="Quarterly KPI dashboard"
                OnElementClick="HandleClick" />

@code {
private readonly IReadOnlyList<BptChartBulletMetric> Data = new BptChartBulletMetric[]
{
    new("Revenue ($k)", Actual: 480, Target: 500,
        Bands: new BptChartBulletBand[]
        { new("Poor", 300), new("OK", 450), new("Good", 600) }),
    // …more metrics
};

private void HandleClick(BptChartElementEvent e) {
    // Click handler — fires regardless of TooltipMode.
}
}