Gauge

Ein Halbkreis für „verbrauchtes Budget“; Schwellen als Markierungen.

Quelltext
$320.00of $500.00 budget
import { Gauge } from "@logicplanes/kaeso-ui";

Props

  • aria-label
    string

    Der zugängliche Name des Diagramms („Anfragen nach Modell“).

  • label
    ReactNode

    Eine Bildunterschrift unter dem Wert („von 500,00 $ Budget“).

  • thresholds
    number[] = [0.8]

    Anteile, die als Striche auf dem Bogen markiert sind (standardmäßig [0.8]). Ab dem niedrigsten wird der Bogen zur Warnung.

  • value
    number

    Der verbrauchte Anteil, von 0 bis 1. Werte über 1 füllen den Bogen und färben ihn als Gefahr.

  • valueLabel
    ReactNode

    Ersetzt den Wert in der Mitte, der sonst der Prozentsatz ist.