лучший способ создать график с помощью graphviz - PullRequest
1 голос
/ 16 июня 2020

это мой 1-й пост здесь, я не уверен, принадлежит ли он правильному подгруппе.

допустим, у нас есть следующий рабочий процесс, определенный в некоторой структуре данных:

enter image description here

Как лучше всего нарисовать этот орграф, используя следующую информацию:

  • есть 2 типа узлов (прямоугольники с 1 входом / 1 выходом максимум, ромбы с 2 входами / 2 выходами не более
  • начальный узел и конечный узел даны
  • связи между узлами (ребрами) известны

enter image description here

Код, который я генерирую с использованием этой информации, дает следующий график:

enter image description here

Что мне не хватает здесь?

Edit1: добавление исходного кода

digraph flow_view {
rankdir = TB;  
graph[fontsize="22"];
node [shape="box", fontsize="11.0", style="filled", fillcolor="peachpuff", fontcolor="black"];
 "Case created" [fillcolor="seagreen1"];
 "Case created" -> "Case assigned" ; 
 "Case assigned" -> "Case review and initial analysis" ; 
 "Case review and initial analysis" -> "Further action required?" ; 
 "Close case" [fillcolor="lightpink"];
 "Further action required?" -> "Close case"[label="No", fontsize="8.5"]
 "Further action required?" [shape="diamond", fillcolor="peachpuff"] ; 
 "Further action required?" -> "Further work"[label="Yes", fontsize="8.5"]
 "Further action required?" [shape="diamond", fillcolor="peachpuff"] ; 
 "Close case" [fillcolor="lightpink"];
 "Satisfactory explanations?" -> "Close case"[label="Yes", fontsize="8.5"]
 "Satisfactory explanations?" [shape="diamond", fillcolor="peachpuff"] ; 
 "Case escalated / reassigned" -> "Further action required?" ; 
 "Satisfactory explanations?" -> "Case escalated / reassigned"[label="No", fontsize="8.5"]
 "Satisfactory explanations?" [shape="diamond", fillcolor="peachpuff"] ; 
 "Further work" -> "Satisfactory explanations?" ; 
}

1 Ответ

0 голосов
/ 18 июня 2020

Мне удалось настроить его, чтобы он соответствовал вашему примеру изображения, не уверен, насколько он масштабируемый. Примерно я сделал следующее:

  • Структурировал код (только для удобства чтения):
    • Определение узла сначала в двух группах, в зависимости от формы
    • Определение ребер второе
    • Упорядоченные соединения в синтаксисе в соответствии с порядком графа
    • Добавлено определение fontsize в качестве глобального свойства края вместо каждого соединения
  • Добавлено некоторое форматирование твики (необязательно)
    • Добавлен более современный шрифт (Arial)
    • Сделан фон прозрачным при экспорте в png.
  • Используется portPos на некоторые узлы (например, "Further work":s). Это указывает, с какой стороной узла ( n orth, e ast, s outh, w est) должен соединяться край.
  • Добавлен constraint=false для некоторых подключений. Это означает, что это соединение не должно учитываться при заказе узлов.
  • Добавлено rank=same для двух групп узлов
  • Добавлено weight для укорочения / выпрямления некоторых краев
digraph flow_view {
rankdir = TB;
splines=splines
graph[fontsize="22", bgcolor="transparent", fontname="Arial"];
//Node definition
node [shape="box", fontsize="11.0", style="filled", fillcolor="peachpuff", fontcolor="black", fontname="Arial"];
    "Case created"               [ fillcolor="seagreen1"];
    "Close case"                 [ fillcolor="lightpink"];
    "Case assigned"
    "Case review and initial analysis"
    "Further work"
    "Case escalated / reassigned"
 node [shape="diamond"];
    "Further action required?"  
    "Satisfactory explanations?"
// Chart definition
edge [fontsize="8.5", fontname="Arial"]
    "Case created"                     -> "Case assigned" ;
    "Case assigned"                    -> "Case review and initial analysis" ;
    "Case review and initial analysis" -> "Further action required?" ;
    "Further action required?":w       -> "Close case":e[label="No", weight=100000, constraint=false]
    "Further action required?":s       -> "Further work":n[label="Yes", weight=10]
    "Further work":s                   -> "Satisfactory explanations?":n [weight=10] ;
    "Satisfactory explanations?":w     -> "Close case":s[label="Yes"]
    "Satisfactory explanations?"       -> "Case escalated / reassigned"[label="No"]
    "Case escalated / reassigned":n    -> "Further action required?":e
// Tweaks
{rank=same "Further action required?";"Close case"}
{rank=same "Satisfactory explanations?";"Case escalated / reassigned"}
}

Rendered graphviz diagram

...