I'm searching for a tool to create software architecture diagrams, like the one below, but i want to be able to zoom out and see only the general picture of the diagram, and zoom in to see the fine grained details of the diagram. Added some example below...

There is such a tool like this?

  • OS Type: Any... WebApp too.
  • GUI approach or Graphviz like doesn't matter
  • Price: Paid or Free

PS: Right now i'm looking for anything with this zooming capability, as this example shows:

Diagram Example
Example of zooming capability (click image for larger variant)


2 Answers 2


I think this sample, implemented in GoJS, demonstrates something similar to what you are looking for: https://gojs.net/latest/samples/regrouping.html.

Note the slider that the user can adjust to implement "semantic zooming". Instead of using a slider one could using mouse wheel turning or finger pinching to achieve the same effects.

This sample diagram does not have any links in it, nor does it use a tree layout; but it would work the same even if it did have both.

  • Pretty cool solution, looks very promising. I'll take a look.
    – vitors
    May 16, 2018 at 23:59

Use http://draw.io/ with containers as explained here.

There are two options:

  1. simply use the shape named "container"
  2. select a shape, select the "Style" tab, scroll down in the "Properties" list and select the "Container" checkbox

If you are too paranoid to use it in-browser, either use the desktop app or host it yourself.

I am not affiliated, but a big fanboy.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.