Blazor Gráfico de barras
El Ignite UI for Blazor Gráfico de barras, el gráfico de barras o el Gráfico de barras horizontal se encuentran entre los tipos de gráficos de categorías más comunes que se utilizan para comparar rápidamente la frecuencia, el recuento, el total o el promedio de datos en diferentes categorías con datos codificados por barras horizontales con alturas iguales pero longitudes diferentes. Este gráfico es ideal para mostrar las variaciones en el valor de un artículo a lo largo del tiempo. Los datos se representan mediante una colección de rectángulos que se extienden de izquierda a derecha del gráfico hacia los valores de los puntos de datos. El gráfico de barras es muy similar al gráfico de columnas, excepto que el gráfico de barras se representa con una rotación de 90 grados en el sentido de las agujas del reloj y, por lo tanto, tiene orientación horizontal (de izquierda a derecha), mientras que el gráfico de columnas tiene orientación vertical (arriba y abajo)
Blazor Bar Chart Example
Puede crear Gráfico de barras Blazor en el control IgbDataChart vinculando sus fuentes de datos a múltiples IgbBarSeries, como se muestra en el siguiente ejemplo:
Bar Chart Recommendations
Are Blazor Bar Charts right for your project?
Blazor Gráfico de barras incluye varias variantes según sus datos o cómo desea contar la historia correcta con sus datos. Éstas incluyen:
- Gráfico de barras agrupadas
- Gráfico de barras apiladas
- Gráfico de barras polares
- Gráfico de barras apiladas
Bar Chart Use Cases
Existen varios casos de uso comunes para elegir un Gráfico de barras:
- Debe mostrar tendencias a lo largo del tiempo o un cambio de valor numérico en una categoría de datos.
- Necesita comparar valores de datos de 1 o más series de datos.
- Quiere mostrar una comparación de parte con el todo.
- Quiere mostrar el porcentaje superior o inferior de las categorías.
- Analizar múltiples puntos de datos agrupados en subcategorías (barra apilada).
Estos casos de uso se utilizan comúnmente para los siguientes escenarios:
- Gestión de ventas.
- La gestión del inventario.
- Gráficos de acciones.
- Cualquier valor de cadena que compare un valor numérico o un valor de serie temporal.
Bar Chart Best Practices:
- Inicie su eje numérico en 0.
- Utilice un solo color para las barras.
- Asegúrese de que el espacio que separa cada barra sea la mitad del ancho de la barra misma.
- Asegúrese de que la clasificación o comparación de categorías (elementos) ordenadas estén ordenadas en orden creciente o decreciente.
- Alinee a la derecha los valores de categoría en el eje Y (etiquetas del lado izquierdo del gráfico) para facilitar la lectura.
When Not to Use Bar Chart
- Tiene demasiados datos, por lo que el eje Y no cabe en el espacio o no es legible.
- Necesita un análisis detallado de series de tiempo; considere un Gráfico de líneas con una serie de tiempo para este tipo de datos.
Bar Chart Data Structure:
- La fuente de datos debe ser una matriz o una lista de elementos de datos.
- La fuente de datos debe contener al menos un elemento de datos.
- La lista debe contener al menos una columna de datos (cadena o fecha y hora).
- La lista debe contener al menos una columna de datos numéricos.
Blazor Bar Chart with Single Series
Gráfico de barras pertenece a un grupo de series de categorías y se representa utilizando una colección de rectángulos que se extienden de izquierda a derecha del gráfico hacia los valores de los puntos de datos. Puede crear este tipo de gráfico en el control IgbDataChart vinculando sus datos a un IgbBarSeries, como se muestra en el siguiente ejemplo:
Blazor Bar Chart with Multiple Series
El Gráfico de barras puede representar varias barras por categoría con fines de comparación. En este ejemplo, el Gráfico de barras compara los ingresos de taquilla entre franquicias de películas populares. Puede crear este tipo de gráfico en el control IgbDataChart vinculando sus datos a múltiples IgbBarSeries, como se muestra en el siguiente ejemplo:
Blazor Bar Chart Styling
Se puede aplicar estilo al Gráfico de barras y permite utilizar valores de anotación para cada barra, por ejemplo, para demostrar comparaciones de porcentajes. Puede crear este tipo de gráfico en el control IgbDataChart vinculando sus datos a IgbBarSeries y agregando un IgbCalloutLayer, como se muestra en el siguiente ejemplo:
Blazor Stacked Bar Chart
Un Gráfico de barras apiladas, o gráfico de barras apiladas, es un tipo de gráfico de categorías que se utiliza para comparar la composición de diferentes categorías de datos mostrando fragmentos de diferentes tamaños en las barras horizontales del gráfico. La longitud de cada barra, o pila de fragmentos, es proporcional a su valor total.
El Gráfico de barras apiladas se diferencia del Gráfico de barras en que los puntos de datos que representan sus datos se apilan uno al lado del otro horizontalmente para agrupar visualmente sus datos. Cada pila puede contener valores tanto positivos como negativos. Todos los valores positivos se agrupan en el lado positivo del eje X y todos los valores negativos se agrupan en el lado negativo del eje X.
Puede crear este tipo de gráfico en el control IgbDataChart vinculando sus datos a IgbStackedBarSeries, como se muestra en el siguiente ejemplo:
Blazor Stacked 100% Bar Chart
El Gráfico de barras apiladas 100 % Blazor es idéntico al Gráfico de barras apiladas Blazor en todos los aspectos, excepto en el tratamiento de los valores en el eje X (etiquetas inferiores del gráfico). En lugar de presentar una representación directa de los datos, el gráfico de 100 barras apiladas presenta los datos en términos de porcentaje de la suma de todos los valores en un punto de datos.
Puede crear este tipo de gráfico en el control IgbDataChart vinculando sus datos a IgbStacked100BarSeries, como se muestra en el siguiente ejemplo:
Additional Resources
Puede encontrar más información sobre tipos de gráficos relacionados en estos temas:
API References
La siguiente tabla enumera los miembros de API mencionados en las secciones anteriores: