Node as cluster #438

bkmeneguello · 2021-01-19T19:26:03Z

This PR contains and supersedes the #407
I'm collaborating with the OP @dan-ash but he seems to be having personal issues to keep this PR up to date.

from diagrams import Cluster, Diagram
from diagrams.aws.compute import ECS
from diagrams.aws.database import RDS, Aurora
from diagrams.aws.network import Route53, VPC

with Diagram("Simple Web Service with DB Cluster", show=True, filename="mysql"):
    dns = Route53("dns")
    web = ECS("service")

    with VPC('VPC'):
        # using cluster with an icon
        with Cluster("DB ClusterA", icon=ECS):
            db_master1 = RDS("main")
            db_master1 - [RDS("replica1"), RDS("replica2")]
        # using the node
        with Aurora("DB ClusterA") as db2:
            db_master2 = RDS("main")
            db_master2 - [RDS("replica1"), RDS("replica2")]

        dns >> web >> db_master1
        # link to/from cluster
        dns >> web >> db2

…com/givanovexpe/diagrams into givanovexpe-feature/add_icons_to_cluster_labels

…0-279-branded-clusters

… class

Node as cluster

dan-ash · 2021-01-28T18:19:39Z

@bkmeneguello I suggest to close this in favour of #439 what do you think? did you got a change to go over it?

bkmeneguello · 2021-02-01T13:57:51Z

@dan-ash Sorry, but I think this PR is more mature and featureful than #439. Maybe I could simplify the commits in more logical ones but this could remove your changes.

seema1711 · 2021-02-19T10:06:37Z

I tried this, but I got the error.

    with VPC('VPC'):
AttributeError: __enter__

Can anyone help?

seema1711 · 2021-02-20T08:01:51Z

I tried this, but I got the error.
    with VPC('VPC'):
AttributeError: __enter__
Can anyone help?

Update:
I tried implementing this:

class VPC(Cluster):
    # fmt: off
    _default_graph_attrs = {
        "shape": "box",
        "style": "dashed",
        "labeljust": "l",
        "pencolor": "#8c8c8c",
        "fontname": "sans-serif",
        "fontsize": "12",
    }
    # fmt: on

class ECS(Cluster):
     # fmt: off
    _default_graph_attrs = {
        "shape": "box",
        "style": "dashed",
        "labeljust": "l",
        "pencolor": "#8c8c8c",
        "fontname": "sans-serif",
        "fontsize": "12",
    }
    # fmt: on

class Aurora(Cluster):
     # fmt: off
    _default_graph_attrs = {
        "shape": "box",
        "style": "dashed",
        "labeljust": "l",
        "pencolor": "#8c8c8c",
        "fontname": "sans-serif",
        "fontsize": "12",
    }
    # fmt: on

but it's not still displaying the cluster branding. Any solution?

One more doubt:
Line Spacing is not working i.e. \n. And what if we want to display two lines on one edge, one on top, and one on bottom. What to do in this case?
Edit: @clayms can you help?

gabriel-tessier · 2021-02-22T11:01:58Z

@bkmeneguello
I run all the examples I found in the source and figure out 2 issues:
First one is with the color, somehow the color order is shifted (I didn't checked the code yet so sorry for the lack of details).

Basically when you do this:

from diagrams import Diagram
from diagrams.onprem.network import Nginx
from diagrams.onprem.container import Docker

with Diagram(name="", direction="TB", show=False, filename="aws"):
    with Docker("Docker") as container:
      with Docker("Docker2 "):
        with Docker("Docker3 "):
          with Docker("Docker4 "):
            with Docker("Docker5 "):
                Nginx("Nginx")

    container

it render that:

Where the first color is green.

If I run the same nested code with actual version I have this:

from diagrams import Diagram
from diagrams.onprem.network import Nginx
from diagrams.onprem.container import Docker

with Diagram(name="", direction="TB", show=False, filename="aws"):
    with Docker("Docker") as container:
      with Docker("Docker2 "):
        with Docker("Docker3 "):
          with Docker("Docker4 "):
            with Docker("Docker5 "):
                Nginx("Nginx")

    container

it render this one:

Which start with blue.

The second problem which is more serious even if there's no tests or example is the support for "graph_attr" in cluster.

from diagrams import Diagram, Cluster
from diagrams.onprem.network import Nginx
# from diagrams.onprem.container import Docker

with Diagram(name="", direction="TB", show=False, filename="aws"):
   with Cluster("AWS", graph_attr={"pencolor": "#60193C", "bgcolor": "#E587B5"}) as container: # overwrite attributes for the default cluster
       Nginx("Nginx")

   container

on master it render this:

on your PR branch it generate an error:


Traceback (most recent call last):
  File "/usr/src/diagrams/example.py", line 9, in <module>
    container
  File "/usr/src/diagrams/diagrams/__init__.py", line 217, in __exit__
    super().__exit__(*args)
  File "/usr/src/diagrams/diagrams/__init__.py", line 71, in __exit__
    self.dot.subgraph(subgraph.dot)
  File "/usr/local/lib/python3.9/site-packages/graphviz/dot.py", line 244, in subgraph
    lines = ['\t' + line for line in graph.__iter__(subgraph=True)]
  File "/usr/local/lib/python3.9/site-packages/graphviz/dot.py", line 244, in <listcomp>
    lines = ['\t' + line for line in graph.__iter__(subgraph=True)]
  File "/usr/local/lib/python3.9/site-packages/graphviz/dot.py", line 110, in __iter__
    yield self._attr % (kw, self._attr_list(None, attrs))
  File "/usr/local/lib/python3.9/site-packages/graphviz/lang.py", line 136, in attr_list
    content = a_list(label, kwargs, attributes)
  File "/usr/local/lib/python3.9/site-packages/graphviz/lang.py", line 109, in a_list
    items = ['%s=%s' % (quote(k), quote(v))
  File "/usr/local/lib/python3.9/site-packages/graphviz/lang.py", line 109, in <listcomp>
    items = ['%s=%s' % (quote(k), quote(v))
  File "/usr/local/lib/python3.9/site-packages/graphviz/lang.py", line 72, in quote
    if is_html_string(identifier) and not isinstance(identifier, NoHtml):
TypeError: expected string or bytes-like object

seema1711 · 2021-02-22T16:50:51Z

from diagrams import Diagram
from diagrams.onprem.network import Nginx
from diagrams.onprem.container import Docker

with Diagram(name="", direction="TB", show=False, filename="aws"):
    with Docker("Docker") as container:
      with Docker("Docker2 "):
        with Docker("Docker3 "):
          with Docker("Docker4 "):
            with Docker("Docker5 "):
                Nginx("Nginx")

    container

this code is not working on my machine, it throws an error:

    with Docker("Docker") as container:
AttributeError: __enter__

gabriel-tessier · 2021-02-23T03:40:30Z

@seema1711
Can you please stop posting on the issues, if you have problem or question you can use stackoverflow on how to use diagrams.
To make it clear this code is not working with your diagrams version, if you want to use the new feature consider forking the PR branch, if you don't understand what I'm talking about, just wait that this feature go in the new release.

Your problem is that you use the actual library version which don't have the code of the PR and it's normal that this error raise.
You are only making noise by posting that it's not working and make us waste time.

gabriel-tessier

Here some fix for the problems I found and commented here: #438 (comment)

I didn't find others issue so far.

One last remarks is the examples directory maybe better to move the code in the website.

gabriel-tessier · 2021-03-26T14:37:28Z

diagrams/__init__.py

+        self.dot.graph_attr["rankdir"] = self._direction
+
+        # Set cluster depth for distinguishing the background color
+        self.depth = self._parent.depth + 1


Here need to be
self.depth = self._parent.depth + 1 if self._parent.depth else 1
To respect the color order.
Check the example in the comment: #438 (comment)

@gabriel-tessier Thank you always for your volunteering. I'll contact you soon.

gabriel-tessier · 2021-03-26T14:55:29Z

diagrams/__init__.py

+        self.depth = self._parent.depth + 1
+        coloridx = self.depth % len(self.__bgcolors)
+        self.dot.graph_attr["bgcolor"] = self.__bgcolors[coloridx]
+


You need to set the attributs at the end after all the default apply so you can overwrite in your diagrams.

for params, attributs in self._attrs.items(): if params == 'graph_attr': for k, v in attributs.items(): self.dot.graph_attr[k] = v

gabriel-tessier · 2021-03-26T14:57:36Z

diagrams/__init__.py

+            self.dot.graph_attr[k] = v
+        for k, v in self._attrs.items():
+            self.dot.graph_attr[k] = v
+


This 2 lines need to be removed: ("The second problem" listed in the comment #438 (comment))
for k, v in self._attrs.items():
self.dot.graph_attr[k] = v

And moved after all the attributes are set also the value of k ad v are not correct chek the code line 378.

DonDebonair · 2021-08-03T09:54:07Z

Any progress on this one? Would love to have this functionality!

mingrammer · 2022-11-04T08:52:31Z

I'm here. Sorry for the late reply. I'll review this PR ASAP. It could be really good improvements. Thank you :)

mingrammer · 2022-11-04T08:52:55Z

@bkmeneguello Please resolve the conflicts.

jobinjosem1 · 2022-12-08T10:23:45Z

@bkmeneguello Do you have time to resolve the conflicts? We really would like to have this feature.

bkmeneguello · 2022-12-08T13:21:45Z

Sorry, two years ago I had the time, now I'm not involved anymore with this project.

lazzurs · 2022-12-14T12:41:18Z

I am willing to take this branch and resolve the conflicts if no one minds? I will open this as a new PR.

Georgi Ivanov and others added 23 commits April 4, 2020 01:15

ability to add icons to the cluster label

45ffea9

Merge branch 'feature/add_icons_to_cluster_labels' of https://github.…

b9f53a8

…com/givanovexpe/diagrams into givanovexpe-feature/add_icons_to_cluster_labels

Merge branch 'givanovexpe-feature/add_icons_to_cluster_labels' into 9…

c93af91

…0-279-branded-clusters

AWS Branded clusters

62a2441

CR changes

676db8e

Azure base clusters

d6f73ec

Allow nodes to be user as cluster

dc33010

Allow node to cluster edges

496a69c

Allow Node as Cluster with same label

0115211

Allow for empty "Node as Cluster" to render as Node

fc9ac5b

Convert the "Cluster" class to a "Node" and extract commons to a base…

bf6a41a

… class

Allow Node icon to be modified

678587a

Fixed issue with nested Clusters and Cluster >> Node edges

91b5798

Escape HTML entities of Cluster label

417047d

Better handling of multiline Cluster labels

070308c

Merge pull request mingrammer#2 from bkmeneguello/node-as-cluster

88fb1f4

Node as cluster

Set Node tooltip to the Class name

8266f7d

Fix Node Cluster "direction", despite it don't work

fb6a2dd

Make Cluster and alias of Node

f7dad6b

Fix node attrs not being copied to Cluster

d3ee0b6

Allow multiline labels be defined as a sequence

1067cf5

Fix unit tests

854fff5

Merge remote-tracking branch 'upstream/master' into node-as-cluster

113b17b

dan-ash mentioned this pull request Jan 23, 2021

Some reorg in order to help and allow others to contribute more #439

Open

mingrammer added kind/feature New feature or request proposal Suggestion proposed status/need-to-review Need to review comp/cluster Issue of cluster component labels Jan 27, 2021

Fix missing cluster label when Node is used

c7a10b7

seema1711 mentioned this pull request Feb 20, 2021

Enable cluster branding #279

Open

gabriel-tessier reviewed Mar 26, 2021

View reviewed changes

nvictor mentioned this pull request Apr 6, 2022

Connecting two cluster #670

Open

shagr4th pushed a commit to shagr4th/diagrams that referenced this pull request Jun 29, 2022

PR mingrammer#438

0e68c79

lazzurs mentioned this pull request Dec 30, 2022

feat: introduce Node as Cluster #823

Closed

Anddd7 mentioned this pull request Dec 13, 2023

🚀 feature: add cluster icon Anddd7/diagrams-ext#1

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Node as cluster #438

Node as cluster #438

bkmeneguello commented Jan 19, 2021 •

edited

Loading

dan-ash commented Jan 28, 2021

bkmeneguello commented Feb 1, 2021

seema1711 commented Feb 19, 2021

seema1711 commented Feb 20, 2021 •

edited

Loading

gabriel-tessier commented Feb 22, 2021 •

edited

Loading

seema1711 commented Feb 22, 2021

gabriel-tessier commented Feb 23, 2021

gabriel-tessier left a comment •

edited

Loading

gabriel-tessier Mar 26, 2021

mingrammer Nov 4, 2022

gabriel-tessier Mar 26, 2021

gabriel-tessier Mar 26, 2021

DonDebonair commented Aug 3, 2021

mingrammer commented Nov 4, 2022

mingrammer commented Nov 4, 2022

jobinjosem1 commented Dec 8, 2022

bkmeneguello commented Dec 8, 2022

lazzurs commented Dec 14, 2022

Node as cluster #438

Are you sure you want to change the base?

Node as cluster #438

Conversation

bkmeneguello commented Jan 19, 2021 • edited Loading

dan-ash commented Jan 28, 2021

bkmeneguello commented Feb 1, 2021

seema1711 commented Feb 19, 2021

seema1711 commented Feb 20, 2021 • edited Loading

gabriel-tessier commented Feb 22, 2021 • edited Loading

seema1711 commented Feb 22, 2021

gabriel-tessier commented Feb 23, 2021

gabriel-tessier left a comment • edited Loading

Choose a reason for hiding this comment

gabriel-tessier Mar 26, 2021

Choose a reason for hiding this comment

mingrammer Nov 4, 2022

Choose a reason for hiding this comment

gabriel-tessier Mar 26, 2021

Choose a reason for hiding this comment

gabriel-tessier Mar 26, 2021

Choose a reason for hiding this comment

DonDebonair commented Aug 3, 2021

mingrammer commented Nov 4, 2022

mingrammer commented Nov 4, 2022

jobinjosem1 commented Dec 8, 2022

bkmeneguello commented Dec 8, 2022

lazzurs commented Dec 14, 2022

bkmeneguello commented Jan 19, 2021 •

edited

Loading

seema1711 commented Feb 20, 2021 •

edited

Loading

gabriel-tessier commented Feb 22, 2021 •

edited

Loading

gabriel-tessier left a comment •

edited

Loading