Синтаксис доски Канбан и руководство по рабочему процессу в Mermaid.js

Доска Канбан — это визуальный инструмент управления рабочим процессом, используемый для отслеживания задач или элементов работы на разных этапах обработки (например, в очереди, в процессе выполнения и завершённые). Представленная как встроенная функция в Mermaid.js, эта текстовая методика позволяет командам разработчиков и менеджерам проектов быстро создавать интерактивные панели задач внутри файлов документации без необходимости управлять ручными приложениями отслеживания или сторонними элементами изображений.

Базовая структура синтаксиса

Каждая доска Канбан начинается с kanban объявления заголовка. Столбцы определяются с помощью section ключевого слова, а отдельные карточки задач перечисляются последовательно под каждым столбцом с использованием блоков отступов.

Mermaid


Редактировать Mermaid в VPasCode
Mermaid Edit Mermaid in VPasCode 
kanban
title "Образец спринта проекта"
section Todo
  Разработать схему базы данных
  Составить маршруты API
section В процессе
  Реализовать промежуточное ПО аутентификации
Edit Mermaid in VPasCode



Редактировать Mermaid в VPasCode

Справочник по синтаксису

В таблице ниже приведены основные компоненты данных и параметры, используемые для создания карты доски Канбан в Mermaid.js.

Компонент синтаксиса Требование типа Описание и правила использования
Объявление Ключевое слово-идентификатор Инициализирует параметры сопоставления блоков гибкого рабочего процесса. Должно использоваться точное kanban блок.
Заголовок Строка в кавычках Необязательный заголовок глобальной рабочей области, центрированный в верхней части холста доски Канбан.
Столбец раздела Ключевое слово + имя Определяет столбец независимого этапа рабочего процесса. Используйте section ключевое слово, за которым следует метка столбца.
Карта стандартной задачи Отступающая строка Простое текстовое описание, представляющее одну карточку. Оно должно быть отступлено или выровнено непосредственно под активным разделом.
Карта идентификатора задачи Идентификатор в квадратных скобках Расширенный формат отслеживания карточек задач, использующий явный уникальный идентификатор вместе с меткой отображения: id[Текст карточки].
Блок метаданных Карта конфигурации JSON Необязательный блок свойств, добавляемый с помощью правила синтаксиса @{...} правила синтаксиса для назначения атрибутов, таких как приоритет билета или владельцы.

Расширенные атрибуты задач и метаданные

Для детальных инженерных спринтов или рабочих процессов отслеживания ошибок вы можете напрямую назначать атрибуты метаданных на карточку. Сопоставив уникальный идентификатор узла (например, task1[...]) с последующим блоком объявления конфигурации JSON (@{}), вы можете напечатать структурированные переменные, такие как исполнители задач, приоритеты и внутренние номера отслеживания, непосредственно на лицевой стороне элемента карточки.

Поддерживаемые переменные задач

Ключ атрибута Форматирование значения Визуальный результат
назначено Имя в кавычках Отображает назначенного владельца или метку разработчика непосредственно внутри матрицы деталей карточки.
приоритет Строка шкалы в кавычках Отображает ориентиры серьезности задачи (например, 'Высокий', 'Средний', 'Низкий').
билет Целочисленный или буквенный токен Отслеживает связанные номера задач разработки или коды системных проектов.

Реальный чертеж: Спринт выпуска гибкой разработки

Этот всесторонний чертеж отслеживает выпуск развертывания инфраструктуры. Он определяет три различных столбца (Бэклог, В процессе и Готово к развертыванию) и использует расширенные идентификаторы задач в паре с параметрами структурной метаданных для назначения конкретных разработчиков и кодов билетов по функциям.

Mermaid


Редактировать Mermaid в VPasCode
Mermaid Edit Mermaid in VPasCode 
канбан
title "Доска выпуска основных функций Q3"
section Бэклог
  task101[Создать документацию для API-конечной точки]@{ assigned: 'Sarah K', priority: 'Средний' }
  task102[Создать макеты страницы входа]
section В процессе
  task201[Уточнить синхронизацию запросов к базе данных]@{ assigned: 'Alex M', priority: 'Высокий', ticket: 4012 }
  task202[Настроить компоненты пользовательского интерфейса Lightbox]@{ assigned: 'Sarah K', priority: 'Низкий' }
section Готово к развертыванию
  task301[Реализовать многофакторную аутентификацию пользователей]@{ assigned: 'Команда разработчиков', ticket: 3985 }
Edit Mermaid in VPasCode



Редактировать Mermaid в VPasCode

Совет по синтаксису: Хотя простые задачи можно вводить как необрамленные строки обычного текста, сложные назначения, содержащие метапараметры, *должны* использовать уникальный префикс строки сопоставления идентификаторов (например, id1[...]@{...}). Повторное использование точного идентичного идентификатора задачи в разных частях доски приведет к перезаписи свойств или возникновению ошибок макета.

Распространенные ошибки синтаксиса и системные ограничения

При проектировании высокоплотных многоэтапных систем макетов помните об этих параметрах структурной диагностики неисправностей:

  • Правило: раздел перед карточками: Все карточки задач должны находиться под активным блоком столбца. Написание строки задачи сразу под основным канбан заголовком без объявления разделами заголовка столбца первым приведет к остановке компиляции.
  • Пробелы и отступы: Двигатель отслеживания макетов группирует карточки на основе табуляции строк. Убедитесь, что все строки карточек задач равномерно отступают под своими активными разделами тегами, чтобы избежать нарушения выравнивания.
  • Формат разделителя метаданных: При создании пользовательских атрибутов внутри @{ } блока ключи и значения должны соответствовать допустимым системным аргументам. Разделяйте несколько атрибутов запятыми и используйте чистые кавычки для обрамления строковых значений.
  • Управление плотностью карточек: Хотя компонент Kanban полностью адаптивен, перегрузка одной доски более чем пятью столбцами или добавление десятков плотных строк метаданных может снизить удобство сканирования на мобильных устройствах. Сознательно подбирайте правила расстановки элементов в макете.
Прокрутить вверх