graphviz
- https://ru.wikipedia.org/wiki/Graphviz
- https://ru.wikipedia.org/wiki/DOT_(%D1%8F%D0%B7%D1%8B%D0%BA)
- https://sketchviz.com/ - штука визуализировать :)
В орг-модном src-блоке:
- :cmd - this header argument can be used to change the layout program from the default "dot". Sensible values are "neato", "fdp", "sfdp", "twopi", and "circo".
- :cmdline - the default sets the dot flag -T to the extension of the output file in order to indicate the output format. Graphviz recognizes three dozen output formats. Other flags that can be set with :cmdline control default graph, node, and edge attributes, among other functionality.
- Result Types. Dot source code blocks produce graphic files, so the default value "file" is the only sensible type of result.
- Other Dot source code blocks currently do not evaluate variables.
By default, DOT assumes the UTF-8 character encoding. Way to avoid non-ASCII characters in labels is to use HTML entities for special characters. During label evaluation, these entities are translated into the underlying character.
In quoted strings in DOT, the only escaped character is double-quote ". That is, in quoted strings, the dyad \" is converted to "; all other characters are left unchanged. In particular, \\ remains \\. Layout engines may apply additional escape sequences.
https://www.graphviz.org/documentation/
- colors - https://www.graphviz.org/doc/info/colors.html
- shapes - https://www.graphviz.org/doc/info/shapes.html
- arrow shapes - https://www.graphviz.org/doc/info/arrows.html
- graph или digraph - особой разницы нет. graph предполагается ненаправленным, связи указываются как
--, отображаются по умолчанию без стрелок. digraph (directed graph) - соответственно, направленный,->, со стрелкой от первого узла к второму. Внешний вид стрелок легко меняется настройками, в остальном разницы, вроде, нет. rankdir=LR- ориентировать граф не сверху вниз, а слева направо. Рулит неимоверно.constraint=false- в случае, если связь предполагается не меняющей ранг узла{rank=same;node1;node2…node_n}- указать, что эти узлы - одного ранга.- If rank="same", all nodes are placed on the same rank.
If rank="min", all nodes are placed on the minimum rank.
If rank="source", all nodes are placed on the minimum rank, and the only nodes on the minimum rank belong to some subgraph with rank="source" or rank="min".
Analogous criteria hold for rank="max" and rank="sink".
(Note: the minimum rank is topmost or leftmost, and the maximum rank is bottommost or rightmost.)
https://www.graphviz.org/docs/attrs/rank/
- If rank="same", all nodes are placed on the same rank.
- Можно слегка дорисовывать svg в inkscape.
- Непонятно, где задавать title, но имеет смысл пошариться потом по началу файла в текстовом режиме, чтоб не вылезало странное tooltip-ом с фона.
- style - как минимум, filled, rounded, invis. Первые два точно можно сочетать на одном узле. Последний годится и для ребер/стрелок.
[style="",shapefile="counters.svg",peripheries=0]- использовала произвольный svg-файл как форму для узла графа.style=""- чтоб перебить filled, который задавала по умолчанию, чтоб не подкрашивался фон вставленного на прозрачном фоне.peripheries=0- чтоб убрать контур, который рисуется по умолчанию.- Перед загрузкой куда-то файла с такими штуками, нужно embed эти самые картинки в inkscape (найти в объектах, выбрать в меню по правой кнопке мыши embed image). Иначе сплывут.
- В имени subgraph-а нужно cluster, чтоб отображалась группа. A cluster is a subgraph placed in its own distinct rectangle of the layout. A subgraph is recognized as a cluster when its name has the prefix cluster. (If the top-level graph has clusterrank=none, this special processing is turned off). - непонятно, то ли можно другие имена, то ли никаких отдельных четырехугольников для subgraph-а.
- https://www.graphviz.org/pdf/dotguide.pdf - клевый мануал
- https://joy.pm/post/2017-09-17-a_graphviz_primer/
- Есть возможность делать label-ы с html-разметкой. Копать подробнее тут - https://www.graphviz.org/doc/info/shapes.html. Вкратце - label ограничивать < и >, а не кавычками, тогда там доступна простая разметка, но перестает работать, например
\n(нужно ставить<br/>). compound=true- If true, allow edges between clusters https://graphviz.org/docs/attrs/compound/A graph may also be described as strict. This forbids the creation of multi-edges, i.e., there can be at most one edge with a given tail node and head node in the directed case. For undirected graphs, there can be at most one edge connected to the same two nodes. Subsequent edge statements using the same two nodes will identify the edge with the previously defined one and apply any attributes given in the edge statement. For example, the graph
will have a single edge connecting nodes a and b, whose color is blue.
- URL - опция узла, позволяющая указать линк, target - где открывать (https://www.w3.org/TR/html401/present/frames.html#adef-target).
Node ports
(Прихвачено из мануала)
A node port is a point where edges can attach to a node. (When an edge is not attached to a port, it is aimed at the node’s center and the edge is clipped at the node’s boundary.)
There are two types of ports. Ports based on the 8 compass points "n", "ne", "e", "se", "s", "sw", "w" or "nw" can be specified for any node. The end of the edge will then be aimed at that position on the node. Thus, if se port is specified, the edge will connect to the node at its southeast “corner”. In addition, nodes with a record shape can use the record structure to define ports, while HTML-like labels with tables can make any cell a port using the PORT attribute of a <TD> element. If a record box or table cell defines a port name, an edge can use that port name to indicate that it should be aimed at the center of the box. (By default, the edge is clipped to the box’s boundary.)
There are also two ways to specify ports. One way is to use an edge’s headport and tailport attributes, e.g.
a -> b [tailport=se]
Alternatively, the portname can be used to modify the node name as part of the edge declaration using the syntax node name:port name. Thus, another way to handle the example given above would be
a -> b:se