# Elementos del tablero

- Human documentation: [https://docs.univer.ai/es-ES/guides/boards/model/board-elements](https://docs.univer.ai/es-ES/guides/boards/model/board-elements)

- Agent Markdown: [https://docs.univer.ai/es-ES/guides/boards/model/board-elements.md](https://docs.univer.ai/es-ES/guides/boards/model/board-elements.md)

- Requested language: `es-ES`

- Content language: `es-ES`

- Documentation version: `1.2.0`

- Source: [boards/model/board-elements.es-ES.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/boards/model/board-elements.es-ES.mdx)

---

Las páginas del tablero almacenan objetos dibujables en `elements` y su orden visual en `elementOrder`. Cada elemento tiene un `id` estable, un `type` y un `transform` que describe su posición y tamaño en el lienzo.

## Campos de elementos comunes

| Campo        | Tipo                             | Descripción                                                                                   |                                        |
| ------------ | -------------------------------- | --------------------------------------------------------------------------------------------- | -------------------------------------- |
| id           | `string`                         | Id. del elemento, único dentro de la página.                                                  |                                        |
| type         | `BoardElementType`               | Tipo de elemento, como `text`, `shape`, `image`, `connector`, `container`, `table` o `group`. |                                        |
| transform    | `IBoardElementTransform`         | Valores de posición, tamaño, rotación, escala, sesgo y giro.                                  |                                        |
| parentId?    | `string`                         | Id. de grupo o contenedor principal.                                                          |                                        |
| laneId?      | `string`                         | Id. de carril de carril cuando el elemento está dentro de un carril.                          |                                        |
| name?        | `string`                         | Nombre del elemento legible por humanos.                                                      |                                        |
| description? | `string`                         | Accesibilidad o metadatos de la aplicación.                                                   |                                        |
| visible?     | `boolean`                        | Si el elemento debe representarse.                                                            |                                        |
| selectable?  | `boolean`                        | Si el editor puede seleccionar el elemento.                                                   |                                        |
| locked?      | `boolean`                        | Si la edición está bloqueada.                                                                 |                                        |
| custom?      | \`Registro\<cadena, desconocido> | null\`                                                                                        | Metadatos definidos por la aplicación. |

## Tipos de elementos

| Tipo        | Extra datos                         | Uso típico                                                                |
| ----------- | ----------------------------------- | ------------------------------------------------------------------------- |
| `text`      | `text`, `textStyle`, `textData`     | Notas adhesivas, etiquetas y bloques de texto enriquecido.                |
| `shape`     | `shapeData`                         | Rectángulos, flechas, leyendas y formas personalizadas.                   |
| `image`     | `source`, `imageSourceType`, `crop` | Imágenes incrustadas.                                                     |
| `connector` | `connectorData`                     | Líneas y flechas adjuntas a puntos o formas libres.                       |
| `container` | `containerData`                     | Marcos, áreas, carriles, paquetes UML y límites del sistema.              |
| `table`     | `tableId`                           | Elementos de tabla de tablero proporcionados por el complemento de tabla. |
| `chart`     | `chartId`                           | Elementos de gráfico.                                                     |
| `media`     | `mediaType`, `source`               | Marcadores de posición de audio y vídeo.                                  |
| `group`     | `children`                          | Colecciones de elementos agrupados.                                       |

## Contenedores

Los contenedores definen el comportamiento de membresía con `containerData.behavior` y capturan reglas con `containerData.capturePolicy`. Utilice los métodos del contenedor de fachada para mover elementos hacia adentro y hacia afuera para que el orden y las relaciones principales se mantengan consistentes.

```ts
board.wrapElementsInContainer(['task-1', 'task-2'], {
  title: 'Sprint 1',
})
```

## Carriles

Un carril es un contenedor con `containerData.swimlane`. Los carriles tienen identificaciones estables, títulos, valores de pedido, tamaños y un estado contraído opcional.

```ts
board.setSwimlaneLanes('lane-board', {
  orientation: 'horizontal',
  lanes: [
    { id: 'todo', title: 'Todo', order: 0, size: 240 },
    { id: 'doing', title: 'Doing', order: 1, size: 240 },
  ],
})
```

## Conectores

Los conectores utilizan puntos finales y datos de enrutamiento. Los puntos finales pueden ser puntos libres, límites de formas, sitios de conexión o líneas de vida. Prefiera operaciones de fachada o acciones de interfaz de usuario para la edición de conectores porque los datos de enrutamiento a menudo dependen de la geometría.