Saltar al contenido
GRÁFICOS · COMPLETE

Gauge

Muestra un único valor en un dial claro, con bandas de color.

Muestra un único valor en un dial claro con bandas de color opcionales.

Por qué ayuda

  • Dial con bandas
  • Accesible
  • Compacto

Dónde encaja

  • Capacidad
  • Temperatura
  • Objetivos
El control Gauge en una página de RayCraft

Ejemplo

<Stack Wrap="true" Align="center" Spacing="6">
    <Gauge Label="CPU load" Value="72" Unit="%" Bands="_bands" />
    <Gauge Label="Disk (half)" Half="true" Value="35" Unit="%" Bands="_bands" />
    <Gauge Label="Speed" Min="0" Max="240" Value="130" Unit=" km/h" />
</Stack>

@code {
    private readonly GaugeBand[] _bands =
    [
        new(0, 60, Severity.Success),
        new(60, 85, Severity.Warning),
        new(85, 100, Severity.Error)
    ];
}

Un breve fragmento. Añade @using RayCraft.Blazor.Components a tu página y usa un modo de renderizado interactivo.

Forma parte de RayCraft Complete.

Todos los controles ยท Documentación