mingrammer / diagrams

:art: Diagram as Code for prototyping cloud system architectures
https://diagrams.mingrammer.com
MIT License
37.51k stars 2.45k forks source link

Some body explains portpos attribute for oreination (connection) between/among nodes #686

Open ncamit opened 2 years ago

clayms commented 2 years ago

https://graphviz.org/docs/attr-types/portPos/

ncamit commented 2 years ago

This I knows but during usage i found difficulties. For example I have node A , B, C , D , E, F,G etc. i WANT TO CONNECT THIS WAY

image

On Sun, Apr 24, 2022 at 11:27 AM clayms @.***> wrote:

https://graphviz.org/docs/attr-types/portPos/

— Reply to this email directly, view it on GitHub https://github.com/mingrammer/diagrams/issues/686#issuecomment-1107726970, or unsubscribe https://github.com/notifications/unsubscribe-auth/AYOFT3NYVFMAAD4B52RAZ3TVGTPCZANCNFSM5UFVQA2Q . You are receiving this because you authored the thread.Message ID: @.***>

-- Amit Nihalchandani.

clayms commented 2 years ago

If you want to connect it radially like that you will have to use a different layout engine like circo and twopi.

See code examples below.

circo

from diagrams import Diagram, Cluster, Edge, Node

graph_attr = {
    "layout":"circo",
    "fontsize": "24",
    "compound": "true",
    "splines":"spline",
}

node_attr = {
    "shape": "circle",
    "style": "filled",
    "color": "grey",
    "fontsize":"24",
    "labelloc":"c",
}

with Diagram("circo layout", show=False, graph_attr=graph_attr) as diag:
    a = Node("a", fillcolor="red", **node_attr)

    for idx in range(2,5):
        exec(f'{chr(96+idx)} = Node("{chr(96+idx)}", fillcolor="green", **node_attr)')

    for idx in range(5,23):
        exec(f'{chr(96+idx)} = Node("{chr(96+idx)}", fillcolor="orange", **node_attr)')

    a >> [b, c, d]
    b >> [e, f, g, h, i, j]
    c >> [k, l, m, n, o, p]
    d >> [q, r, s, t, u, v]

diag

image

twopi:

from diagrams import Diagram, Cluster, Edge, Node

graph_attr = {
    "layout":"twopi",
    "fontsize": "24",
    "compound": "true",
    "splines":"spline",
    "ranksep":"3",
}

node_attr = {
    "shape": "circle",
    "style": "filled",
    "color": "grey",
    "fontsize":"24",
    "labelloc":"c",
}

with Diagram("\ntwopi layout", show=False, graph_attr=graph_attr) as diag:
    a = Node("a", fillcolor="red", **node_attr)

    for idx in range(2,5):
        exec(f'{chr(96+idx)} = Node("{chr(96+idx)}", fillcolor="green", **node_attr)')

    for idx in range(5,23):
        exec(f'{chr(96+idx)} = Node("{chr(96+idx)}", fillcolor="orange", **node_attr)')

    a >> [b, c, d]
    b >> [e, f, g, h, i, j]
    c >> [k, l, m, n, o, p]
    d >> [q, r, s, t, u, v]

diag

image

ncamit commented 2 years ago

I want to connect interconnections among nodes thats absolute position is set by x y coordinates and node has the feature that any port can be assigned to to it for interconnection. My block diagram is generated from excel table as input

On Sun, Apr 24, 2022, 5:55 PM clayms @.***> wrote:

If you want to connect it radially like that you will have to use a different layout engine like circo and twopi.

See code examples below.

circo

from diagrams import Diagram, Cluster, Edge, Node

graph_attr = { "layout":"circo", "fontsize": "24", "compound": "true", "splines":"spline", } node_attr = { "shape": "circle", "style": "filled", "color": "grey", "fontsize":"24", "labelloc":"c", }

with Diagram("circo layout", show=False, graph_attr=graph_attr) as diag: a = Node("a", fillcolor="red", **node_attr)

for idx in range(2,5):
    exec(f'{chr(96+idx)} = Node("{chr(96+idx)}", fillcolor="green", **node_attr)')

for idx in range(5,23):
    exec(f'{chr(96+idx)} = Node("{chr(96+idx)}", fillcolor="orange", **node_attr)')

a >> [b, c, d]
b >> [e, f, g, h, i, j]
c >> [k, l, m, n, o, p]
d >> [q, r, s, t, u, v]

diag

[image: image] https://user-images.githubusercontent.com/12793783/164976320-b4db4883-8e26-4db7-a486-6e31b4c52765.png

twopi:

from diagrams import Diagram, Cluster, Edge, Node

graph_attr = { "layout":"twopi", "fontsize": "24", "compound": "true", "splines":"spline", "ranksep":"3", } node_attr = { "shape": "circle", "style": "filled", "color": "grey", "fontsize":"24", "labelloc":"c", }

with Diagram("\ntwopi layout", show=False, graph_attr=graph_attr) as diag: a = Node("a", fillcolor="red", **node_attr)

for idx in range(2,5):
    exec(f'{chr(96+idx)} = Node("{chr(96+idx)}", fillcolor="green", **node_attr)')

for idx in range(5,23):
    exec(f'{chr(96+idx)} = Node("{chr(96+idx)}", fillcolor="orange", **node_attr)')

a >> [b, c, d]
b >> [e, f, g, h, i, j]
c >> [k, l, m, n, o, p]
d >> [q, r, s, t, u, v]

diag

[image: image] https://user-images.githubusercontent.com/12793783/164976375-9c28d8b7-bd50-40e3-bdbd-aedc514cbd2c.png

— Reply to this email directly, view it on GitHub https://github.com/mingrammer/diagrams/issues/686#issuecomment-1107830892, or unsubscribe https://github.com/notifications/unsubscribe-auth/AYOFT3JOORL5DD2E4U3DCVLVGU4TVANCNFSM5UFVQA2Q . You are receiving this because you authored the thread.Message ID: @.***>

clayms commented 2 years ago

@ncamit You'll have to show your code.