When to use it
Use a domain that includes zero and every supplied measurement. Localize targetLabel and labels for the application.
Data displayReact Native
Bullet chart
Compare an actual value with a target and labeled performance ranges.
Native example
Use Bullet chart
Use a domain that includes zero and every supplied measurement. Localize targetLabel and labels for the application.
View captured React Native example
<LumenBulletChart label="On-time delivery" value={86} target={95} domain={{ min: 0, max: 100 }} />Reference
Public API
The primary shared and platform-specific options exposed by LumenBulletChart.
| API | Values or type | Default | Description |
|---|---|---|---|
| value, target | Nullable measurement, finite target | Required | Null is unavailable; zero is a measured value. |
| ranges | LumenBulletRange[] | [] | Uses labeled finite range ends sorted without changing the source data. |
| domain | Finite numeric range | Automatic | Includes zero, target, actual, and all ranges; invalid input fails closed. |
| labels, targetLabel, valueLabel | Localized chart labels | English | Labels the summary, visible measurements, and exact data list. |
| showData | Boolean | true | Provides the expandable actual, target, and range boundaries. |
Native behavior
Design and accessibility
Accessibility
Exposes exact actual, target, and range values; missing values remain distinct from zero.
Shared component