# Gráfico de barras

> Un gráfico de barras verticales con etiquetas. Un componente nativo de Pyzed para GUIs de escritorio en Python, con vista previa, ejemplos y su API.

Source: https://albakore.github.io/pyzed/es/library/bar-chart/

:::tip[En pocas palabras]
Un gráfico de barras para comparar unas pocas cantidades.
:::

Un gráfico de barras verticales dibujado con `pz.canvas` en los colores del tema, con etiquetas opcionales bajo las barras.

`ui.bar_chart` · Categoría: [Datos](https://albakore.github.io/pyzed/es/library/#datos) · [Referencia completa →](https://albakore.github.io/pyzed/es/reference/ui/#bar_chart)

**Código:**

```python
ui.bar_chart([12, 19, 8, 15, 22, 17, 9], labels=["M", "T", "W", "T", "F", "S", "S"],
             width=360, height=180)
```

## Cuándo usarlo

- Para comparar unos pocos valores lado a lado (por día, por categoría).

## Uso

```python
from pyzed import ui

ui.bar_chart([12, 19, 8, 15, 22, 17, 9], labels=["M", "T", "W", "T", "F", "S", "S"],
             width=360, height=180)
```

## Variantes

:::note[Sobre estas capturas]
Cada captura la graba pyzed mismo, fuera de pantalla a 2x, en One Dark o One Light según el tema de este sitio, y recortada al componente para que se vea a su tamaño real. El puntero pasa por encima, pulsa o escribe en él; un componente que no reacciona al puntero recorre algunos temas. Con movimiento reducido ves el primer fotograma. Abre **Código** bajo una captura para ver el fragmento que la dibuja; los nombres libres como `on_save` son tus propios callbacks.
:::

### Opciones

```python
ui.bar_chart([12, 19, 8, 15, 22], labels=["M", "T", "W", "T", "F"], width=240, height=120)
```

```python
ui.bar_chart([4, 8, 6, 9, 3, 7, 5, 10], width=240, height=100)
```

```python
ui.bar_chart([5, 9, 7, 12], labels=["Q1", "Q2", "Q3", "Q4"], width=240, height=120, tint="success")
```

```python
ui.bar_chart([30, 12, 18], labels=["cpu", "io", "net"], width=240, height=120, tint="warning")
```

## Eventos

Gráfico de barras no tiene eventos propios: muestra lo que le das. Como todo widget, también tiene los **18 eventos comunes** (`click`, `double_click`, `right_click`, `mouse_enter`, `drag`, `key_down`, `resize`…), que se conectan con `.on(...)`: mira [Eventos](https://albakore.github.io/pyzed/es/guides/events/) y [Eventos de cada componente](https://albakore.github.io/pyzed/es/library/events/).

## Propiedades y API

### `ui.bar_chart`

```python
bar_chart(values, *, labels=None, width=320, height=160, tint='accent', theme=None)
```

Un gráfico de barras vertical con etiquetas opcionales.

| Propiedad | Por defecto | Descripción |
| --- | --- | --- |
| `values` | *obligatorio* | Valores. |
| `labels` | `None` | Etiquetas bajo cada barra. |
| `width` | `320` | Ancho: píxeles, `"fill"`, `"shrink"` o `"fill:N"` (proporción). |
| `height` | `160` | Alto: píxeles, `"fill"`, `"shrink"` o `"fill:N"` (proporción). |
| `tint` | `"accent"` | Color semántico: `"accent"`, `"error"`, `"warning"`, `"success"`, `"info"` o un token. |
| `theme` | `None` | Tema a usar en lugar del actual (`pyzed.theme.current()`). |

[Referencia completa →](https://albakore.github.io/pyzed/es/reference/ui/#bar_chart)

## Relacionados

- [Dona](https://albakore.github.io/pyzed/es/library/donut/): Un gráfico de dona con una etiqueta en el centro.
- [Minigráfico](https://albakore.github.io/pyzed/es/library/sparkline/): Un gráfico de líneas diminuto para tendencias.
- [Cifra](https://albakore.github.io/pyzed/es/library/stat/): Una cifra de dashboard con variación y minigráfico.
