Infragistics Ignite UI for Angular Gauges

InfragisticsControles de GaugeJavaScript

Visualiza datos con precisión mediante componentes gauge flexibles para Angular.

  • Incluye componentes de gauge lineal, radial y bullet graph.
  • Admite transiciones animadas con duraciones personalizables.
  • Permite una personalización detallada de agujas, rangos, etiquetas y escalas.
Infragistics logo

Precios desde:

Cargando...
Disponible en
Infragistics Ignite UI for AngularCargando
Infragistics Ignite UICargando
Infragistics ProfessionalCargando
Infragistics UltimateCargando
¿Necesitas ayuda para elegir? Consulta Cómo comprar y la especificación
imagen del producto Infragistics Ignite UI for Angular Gauges
Ignite UI for Angular Gauges proporciona un conjunto de componentes diseñados para visualizar datos en gauges claros y eficaces. Los desarrolladores de Angular pueden integrar gauges lineales, radiales y bullet graph, cada uno con soporte para escalas, agujas, rangos y transiciones animadas personalizables. Estos componentes son ideales para métricas de paneles, seguimiento del rendimiento y comparaciones de objetivos.

Componente Linear Gauge

Muestra valores frente a una escala mediante un diseño lineal. Admite orientación configurable, dirección, una aguja para indicar el valor y marcas de graduación y etiquetas personalizables. Incluye transiciones animadas con duración ajustable.

Componente Radial Gauge

Presenta valores en una escala circular o con forma de arco con elementos visuales como agujas, marcas de graduación y etiquetas. Ofrece propiedades para personalizar las formas de fondo, los arcos de escala, las direcciones de barrido y admite escalado óptico para el tamaño dinámico de las etiquetas.

Componente Bullet Graph

Muestra valores de rendimiento y objetivo en una escala lineal ocupando un espacio mínimo. Visualiza el progreso con una barra de rendimiento y un marcador de objetivo, e incluye rangos comparativos para una evaluación cualitativa. Admite la personalización de la orientación y la dirección.

Aguja y Highlight Needles

Todos los tipos de gauge admiten una o dos agujas para representar los valores principal y resaltado. Las formas de las agujas y los estilos de pivote se pueden personalizar. Los gauges radiales permiten opcionalmente arrastrar la aguja de forma interactiva por parte de los usuarios.

Rangos

Elementos visuales que resaltan intervalos de valores en la escala para indicar estados cualitativos o umbrales. Se pueden agregar varios rangos con brushes y contornos personalizables para comunicar visualmente los niveles de rendimiento.

Marcas de graduación y etiquetas

Las marcas de graduación principales y secundarias dividen la escala en intervalos para mayor claridad. Las etiquetas muestran valores numéricos colocados a lo largo de las escalas, con opciones de estilo para fuentes y colores que mejoran la legibilidad.

Personalización del fondo y la escala

Los fondos sirven como fondo y borde de los gauges, y se renderizan debajo de todos los demás elementos. Las escalas se pueden invertir o estilizar con brushes y extensiones adaptados para ajustarse a los requisitos de diseño y a los rangos de valores.

Transiciones animadas

Los gauges incorporan compatibilidad integrada para transiciones animadas al actualizar valores. La duración de la animación es configurable, lo que permite actualizaciones de datos suaves y visualmente atractivas.

Integración y dependencias

Cada componente de gauge requiere el paquete principal de Ignite UI Angular. Los módulos de cada tipo de gauge deben importarse en las aplicaciones de Angular para habilitar sus características y funcionalidades.

Compatibilidad del producto

Revise los detalles a continuación para asegurarse de que este producto sea compatible con su entorno.

Tipo de componente

  • JavaScript

Plataforma JavaScript

  • Angular
  • JavaScript vanilla