Diagrama Kanban
El diagrama kanban de Mermaid te permite crear una representación visual del flujo de tareas por las distintas fases de un flujo de trabajo; a continuación se explica cómo usar correctamente la sintaxis del diagrama kanban.
Básico
El diagrama kanban empieza con la sintaxis kanban y luego define las columnas y las tareas de esas columnas.
Copiar
Insertar
kanban
column1[Column Title]
task1[Task Description]
Definir columnas
Las columnas representan las distintas fases de un flujo de trabajo, por ejemplo "Pendiente", "En curso", "Completado", etc. Cada columna se define con un identificador único y un título encerrado entre corchetes.
Sintaxis:
Copiar
Insertar
columnId[Column Title]
- columnId: el identificador único de la columna.
- [Column Title]: el título que se muestra en la cabecera de la columna.
比如 id1[Todo]
Añadir tareas a una columna
Las tareas se muestran en sus respectivas columnas, con indentación. Cada tarea incluye un identificador único y una descripción encerrada entre corchetes.
Sintaxis:
Copiar
Insertar
taskId[Task Description]
taskId: el identificador único de la tarea.,[Task Description]: la descripción de la tarea.
Ejemplo:
Copiar
Insertar
docs[Create Documentation]
Añadir metadatos a una tarea
Puedes usar la sintaxis @{ ... } para añadir metadatos adicionales a cada tarea. Los metadatos pueden contener pares clave-valor como assigned, ticket, priority, etc., que se mostrarán en el renderizado del nodo.
Claves de metadatos admitidas
Asignado a: especifica quién es responsable de la tarea.,Ticket: vincula la tarea a un número de ticket o de incidencia.,Prioridad: indica la urgencia de la tarea. Valores permitidos: Muy alta, Alta, Baja y Muy baja.
Copiar
Insertar
kanban
todo[Todo]
id3[Update Database Function]@{ ticket: MC-2037, assigned: 'knsv', priority: 'High' }
Opciones de configuración
Puedes personalizar el diagrama kanban con el bloque de configuración al inicio del archivo markdown. Esto resulta útil para establecer ajustes globales (como la URL base de los tickets). Actualmente, el diagrama kanban <code>ticketBaseUrl</code> esto resulta muy útil para establecer ajustes globales, por ejemplo la URL base de los tickets. Actualmente el gráfico kanban tiene una opción de configuración ticketBaseUrl. Se puede establecer como en el siguiente ejemplo:
Copiar
Insertar
---
config:
kanban:
ticketBaseUrl: 'https://yourproject.atlassian.net/browse/#TICKET#'
---
Cuando una entrada del kanban tiene un número de ticket especificado, el número de ticket del gráfico incluirá un enlace al sistema externo que define ese ticket. ticketBaseUrl establece la URL base que apunta al sistema externo, y #TICKET# se sustituye por el valor del ticket de los metadatos de la tarea, para crear un enlace válido.
Ejemplo completo
A continuación se muestra un ejemplo completo de código de diagrama kanban:
Copiar
Insertar
---
config:
kanban:
ticketBaseUrl: 'https://mermaidchart.atlassian.net/browse/#TICKET#'
---
kanban
Todo
[Create Documentation]
docs[Create Blog about the new diagram]
[In progress]
id6[Create renderer so that it works in all cases. We also add some extra text here for testing purposes. And some more just for the extra flare.]
id9[Ready for deploy]
id8[Design grammar]@{ assigned: 'knsv' }
id10[Ready for test]
id4[Create parsing tests]@{ ticket: MC-2038, assigned: 'K.Sveidqvist', priority: 'High' }
id66[last item]@{ priority: 'Very Low', assigned: 'knsv' }
id11[Done]
id5[define getData]
id2[Title of diagram is more than 100 chars when user duplicates diagram with 100 char]@{ ticket: MC-2036, priority: 'Very High'}
id3[Update DB function]@{ ticket: MC-2037, assigned: knsv, priority: 'High' }
id12[Can't reproduce]
id3[Weird flickering in Firefox]
En resumen, crear un diagrama kanban en Mermaid es un proceso sencillo que permite visualizar tu flujo de trabajo de forma eficaz.
Puedes mejorar tu gráfico añadiendo metadatos opcionales a las tareas con la sintaxis @{ ... }; esta sintaxis te permite incluir información de contexto adicional, como el responsable, el número de ticket y la prioridad. Para personalizaciones adicionales, usa el bloque de configuración en la parte superior del archivo para establecer opciones globales, como ticketBaseUrl, para poder enlazar tickets directamente desde el gráfico.
Si sigues estas pautas, te aseguras de usar identificadores únicos y una indentación correcta, y aprovechas los metadatos y las opciones de configuración, podrás crear un diagrama kanban completo y personalizado que refleje de forma eficaz el flujo de trabajo del proyecto.
