schema:反映顶点label之间的关系,以及Label会有哪些常量类型
用G6
<id> <label> <vertex label>.
<id> <edge label> <id>.
<id> <vertex property> literal.
不可以拖拽
http://graphviz.herokuapp.com/?token=eeb362635d6b026b24d7b012b3ba6ee7
想尝试
https://github.com/magjac/graphviz-visual-editor
加箭头https://g6.antv.vision/zh/docs/manual/middle/elements/edges/arrow
可以拖拽https://g6.antv.vision/zh/examples/net/forceDirected#basicForceDirected
graphviz
digraph ClassDiagram {
#//////////////////////////////// Introduction \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
/*
This graph is meant as a starting point to help you create UML Class
Diagrams by providing a preset for edges and nodes.
To use it, you need to take the folowing steps:
- Copy and paste (or "save as") this graph into a new file
- Rename the relevant labels (anything with the word "Example" in it).
- Add nodes (inside subgraphs when needed)
- Add connections for the nodes
Make sure you place your connections under the right headers, otherwise the
decoration won't match the UML specifications.
For each module you should use a separate subgraph. Make sure the name of
your subgraph starts with `cluster_`
If you don't like the colors, the easiest way to ammend this is by changing
the defined colorscheme (currently "pastel13") in the "General Styles"
section to any other 3-scheme. All available colorschemes can be found at
http://www.graphviz.org/doc/info/colors.html#brewer
*/
#/////////////////////////////// General Styles \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
graph [
label = "Example \n Class Diagram"
labelloc = t
//dpi = 200
ranksep=0.65
nodesep=0.40
rankdir=BT
bgcolor="#FFFFDD"
style="dotted, filled"
fillcolor="#FFFFFF"
]
edge [arrowhead=empty] //空心箭头 =none则无箭头
node [
labeljust="l"
colorscheme="pastel13"
style=filled
fillcolor=3
shape=record
]
#/////////////////////////////////// subgraph \\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\
//可以添加很多子图
subgraph schema {
//label = "Example \n subgraph Diagram" //子图标题
//nodes
alarm [label="{alarm|arriveTime}"]
lip [label="{lip|slotnum}"]
}
{ //edges
lip -> alarm [label="like"]
lip -> alarm [label="happen"]
}
}//ClassDiagram