mermaid-js / mermaid

Generation of diagrams like flowcharts or sequence diagrams from text in a similar manner as markdown
https://mermaid.js.org
MIT License
72.06k stars 6.54k forks source link

New diagram type: labelled port graph #1859

Open IceflowRE opened 3 years ago

IceflowRE commented 3 years ago

It would be a great idea to support the visualization of labeled port graphs, often used in Visual Scripting. For example:

Godot Visual Scripting

Syntax could be similiar to the class diagram

node_one[Node One] {
    < label_symbol_type input_one: "Number"
    < label_symbol_type input_two: "Other Number"
    > label_symbol_type output: "Result"
}

node_one[Node Two] {
    < label_symbol_type input_one: "Number"
    < label_symbol_type input_two: "Other Number"
    > label_symbol_type output: "Result"
}

node_one(output) --> node_two(input_one)
node_one(output) --> node_two(input_two)

Node

node_one[Node Two] Node id and its name.

Label

< label_symbol_type input_one: "Number"

Then the label id with the name.

Additionally would be nice to have an option to change the color of the label symbol.

Connections

node_one(output) --> node_two(input_one) Node id with the label connects with the known line types to another label.

EEflow commented 3 years ago

Yes, great idea!

labelled_port_graph