¡Enseñarle experiencia en visualización de big data y diseño de gráficos en pantalla grande!

Desde que compartí el primer artículo con ustedes, "Visualización de Big Data y experiencia de diseño en pantalla grande, ¡enseñe!" ", muchos amigos me harán algunas preguntas relacionadas. Después de leer los borradores visuales que me enviaron mis amigos, en general son buenos, pero descubrí que hay algunos problemas en el diseño de los gráficos. Es posible que tenga menos experiencia en gráficos. diseño para visualización de datos, por lo que este artículo profundizará en los detalles del rendimiento de los gráficos, compartirá los obstáculos que he encontrado y mi comprensión del diseño de gráficos.

¿Diseño de gráficos?

Concepto de diseño de gráficos

El diseño de gráficos es una rama de la visualización de datos. Es un procesamiento secundario de datos que utiliza gráficos estadísticos. El rendimiento central de la visualización de datos no solo debe garantizar que los datos del gráfico en sí sean claros, precisos, intuitivos y fáciles de entender, sino también resaltar adecuadamente el contenido principal que interesa a los usuarios para ayudarlos a tomar decisiones a través de los datos.

A continuación se analizan tres diseños de gráficos visuales de uso común:

Gráfico de líneas

Los gráficos de líneas se utilizan a menudo para representar cambios y tendencias en los datos. ejes de coordenadas La magnitud del cambio tiene un gran impacto.

El eje de coordenadas de la figura de la izquierda está establecido demasiado bajo y el cambio de la polilínea es demasiado pronunciado. El rango de valores en la figura es (10-34). El rendimiento de la visualización de datos exagera. tendencia del cambio de la polilínea.

Si el valor del eje de coordenadas en la figura de la derecha se establece demasiado alto, el cambio de la polilínea será demasiado suave y el cambio de la polilínea no se podrá expresar claramente.

Un gráfico de líneas razonable debe ocupar dos tercios del gráfico. El rango de valores del eje X del gráfico debe cambiar según el aumento o disminución del valor de la línea. el hermano y la hermana de front-end en cálculo dinámico.

El grosor de la polilínea en el gráfico de líneas debe ser razonable. Una polilínea demasiado delgada reducirá el rendimiento de los datos, y una polilínea demasiado gruesa perderá los detalles de las fluctuaciones de los datos en la polilínea. ¡Es visualmente difícil encontrar con precisión el valor correspondiente del punto de polilínea! Normalmente uso una línea de dos píxeles, ¡parece correcto!

El color de las líneas de escala en la imagen de la derecha es demasiado intenso, lo que afecta el rendimiento de los datos del gráfico. El contraste entre la línea de base cero y las líneas de escala en el gráfico no es lo suficientemente obvio. Todo es muy desordenado. La línea de base cero enfatiza la posición inicial y generalmente es más prominente que el color de la línea en el gráfico.

Gráfico de barras/gráfico de columnas

Lo ideal es muy regordete, pero la realidad es muy flaca. Este caso es un problema que encontré en el trabajo antes. Después de que llegaron los datos, me sorprendió que la causa del problema fuera que no me comuniqué bien con los chicos de front-end. lo que condujo a este problema. De hecho, debería ser así. Los rangos de valores de estos gráficos deben escribirse como cálculos dinámicos.

Por ejemplo, tomando el rango numérico actual como ejemplo, el valor más alto de los datos es 18 y el valor más alto del eje X debe ser 25. Cuando los datos alcanzan una cierta altura, el eje X se eleva a la altura numérica correspondiente. Esto evita el problema que se muestra a la derecha.

Es mejor organizar el texto de la etiqueta del eje de coordenadas horizontalmente. Cuando el texto de la etiqueta del eje X es demasiado, no se recomienda organizarlo de forma oblicua, hacia arriba y hacia abajo, o en una nueva línea. ¡Si hay demasiado texto, dicha visualización reduce en gran medida la legibilidad! ¡La siguiente figura ofrece dos soluciones para mejorar en gran medida la legibilidad del texto de la etiqueta!

Solución

Si las columnas están demasiado dispersas, se perderá la correlación entre los datos, y si las columnas son demasiado densas, no habrá independencia entre los datos, lo cual es no propicio para una lectura cómoda.

Cuando la columna es n, se recomienda que la distancia directa entre las columnas no sea muy diferente de n. La distancia entre las columnas a los lados es preferiblemente la mitad de la distancia entre las columnas, que es. el más cómodo visualmente.

Gráfico circular

No se recomienda mostrar la imagen de la izquierda junto con el valor porcentual en el gráfico circular. La forma y el tamaño del gráfico circular se desbordarán fácilmente cuando. hay demasiadas palabras. Si aparece un 2. Si el % es 1%, será difícil identificar la dirección del gráfico, perdiendo así el significado de visualización de datos. El PPT generalmente tiene ese estilo de diseño porque es un gráfico muerto.

En la tercera imagen de la izquierda, los hábitos de lectura de las personas son de izquierda a derecha y de arriba a abajo, por lo que los datos están ordenados de mayor a menor, lo que favorece la lectura y los gráficos son más hermosos. !

Cuando el gráfico circular es la tasa de detección, o la detección de información importante se centra en los datos, no se recomienda organizar los datos grandes y pequeños en el sentido de las agujas del reloj. Esta situación en la imagen de la izquierda generalmente ocurre raramente, porque el. la atención se centra en la detección. Es inútil mostrar valores numéricos y datos no detectados. ¡Puede ser necesario en casos excepcionales!

La imagen de la derecha es más adecuada para datos con tasas de detección similares. Es intuitiva y clara, ¡y no hay interferencias de datos inútiles!

Cuando el gráfico circular tiene demasiadas dimensiones de etiqueta, no es adecuado mostrar los datos alrededor del gráfico circular. Será complicado y difícil de leer. ¡La solución es la que se muestra a la derecha!

Diagrama de clasificación de gráficos

Comparta una clasificación de gráficos completa, guárdela y diseñe productos de visualización de datos, ¡tendrá un valor de referencia importante!

Esta imagen es un resumen aproximado de las distintas características de la carta realizada por el diseñador Abela.