Gráfico circular

    El Gráfico circular es un gráfico circular que se divide en porciones o segmentos para ilustrar cómo las categorías (partes) de un conjunto de datos suman un valor total (completo). Cada sección, o sector circular, tiene una longitud de arco, proporcional a su valor de datos subyacente. Las categorías se muestran en proporción a otras categorías según su porcentaje de valor con respecto al valor total que se analiza, como partes de 100 o 100%. Los gráficos circulares son apropiados para conjuntos de datos pequeños y son fáciles de leer y comprender de un vistazo. El Gráfico circular es visualmente idéntico a la Ignite UI for Angular componente Gráfico circular angular

    Pie Chart Demo

    El Gráfico circular se compone de un grupo Series, dividido en series individuales (porciones) y Labels con Hairlines, que apuntan a la serie correspondiente.

    Series

    El componente Gráfico circular viene con cantidades de series 3, 4 y 5. En Figma puedes cambiar entre los tres usando la propiedad "Cantidad de serie" del panel de propiedades, mientras que en Sketch esto se logra con Symbol Overrides.

    Hairlines

    Las etiquetas en el Gráfico circular tienen líneas correspondientes. Puede elegir entre tres posiciones de etiquetas: Centro, Extremo interior y Extremo exterior. En Figma puede cambiar la posición simplemente seleccionando el componente Posición de etiquetas anidadas y cambiando el valor de la propiedad "Posición" desde el panel de propiedades, mientras que en Sketch se logra con Symbol Overrides. También puede ocultar las líneas capilares en el tipo OutsideEnd desactivando la propiedad booleana "líneas capilares" en el panel de propiedades de Figma. En Sketch puedes lograr esto configurándolos en ~Sin símbolo.

    `Centro``EndInside``Fin externo`

    Estilismo

    En primer lugar, el Gráfico circular te permite cambiar los colores de la serie. Se recomienda utilizar solo colores de la paleta para visualizaciones de datos con matices denominados serie.1, serie.2 y así sucesivamente hasta serie.10. También puedes cambiar los colores de las Líneas, pero deben coincidir con los colores de la serie correspondiente. Las etiquetas también se pueden personalizar a través de los estilos de texto disponibles en el sistema Indigo.Design.

    Usage

    Utilice el Gráfico circular para visualizar cómo las categorías (partes) de un conjunto de datos suman un valor total (completo). No debes utilizar el mismo color para dos o más categorías para evitar confusión y mala interpretación de los datos. También se recomienda ceñirse a una cantidad de serie entre 3 y 5 para que el Gráfico circular sea fácil de leer y comprender. Para reducir el desorden en los gráficos y hacer que sea más fácil centrarse en valores o categorías más grandes y significativos, considere usar una porción o segmento de categoría "Otros" para representar el porcentaje total de todos los valores más pequeños.

    Hacer No

    Additional Resources

    Tema relacionado:

    Nuestra comunidad es activa y siempre da la bienvenida a nuevas ideas.