I really would love this if it would use more characters (UTF-8?) to create more beautiful diagrams:

Instead of this:

     + - - - +
     ' HELLO '
     + - - - +
    

Do this:

    ┌───────┐
    │ HELLO │
    └───────┘

There are so many characters available for this, that it would be possible to draw totally awesome diagrams in just text:

https://www.w3schools.com/charsets/ref_utf_box.asp

This is pretty easy to implement: https://github.com/ggerganov/dot-to-ascii/blob/79fd551467457...

Just replace `--as_ascii` with `--as=boxart`[1]

1. https://metacpan.org/pod/distribution/Graph-Easy/bin/graph-e...

Thanks for this comment! I didn't know about the "--as=boxart" option.

I just made this the default display, with an option to toggle back to "--as_ascii".

Here is a very quick "sed" hack to replace vertical and horizontal lines: https://dot-to-ascii.ggerganov.com/staging/

Definitely looks better. Might look into fixing the corners and arrows as well before merging in master.

On this note, Midnight Commander, ZZT, and MegaZeux come to mind for classic apps with UIs constructed entirely from box-drawing characters.

This is a basic web service that I put together this afternoon to generate ASCII diagrams from .dot input. Hope it could be useful to someone.

Interesting, why a PHP wrapper to the graph-easy CLI rather than a perl cgi/fcgi/… to the graph-easy library?

edit: sending the graph info via GET is a bit risky though, browsers and servers tend to limit URL size so you might get truncation on the bigger graphs (IIRC IE is the biggest issue with ~1k URLs, not sure if pre-chrome Edge is better or the same, then it's mostly webservers which generally have an 8k default limit on the request-line).

Yes, that makes more sense. I just used whatever I was more familiar with to get stuff running

edit: missed "used"

fair enough, 'bout what I was thinking.

Anyway good job, it certainly maximises usefulness for the complexity. Especially good call on using the codemirror editor, I'd have not thought of it but it makes the thing much nicer to use.

This is pretty cool! I probably would have never discovered graph-easy if it weren't for this.

One thing though, it doesn't handle errors that nicely, e.g. for input "a" it outputs "null". Nitpicking aside, it's neat.

Edit: I wonder what sort of heuristics graph-easy is using behind the scenes to decide where to place the clusters, etc., and how it can tell whether a particular input is feasible or not.

Past alternatives: https://news.ycombinator.com/item?id=2651745

Can't some reasonable person refresh our website so we would have more useful content like this? :-) also include Sketchviz https://news.ycombinator.com/item?id=21518152 don't include anything from haters though

You can fork it on gitlab, https://gitlab.com/graphviz/graphviz.gitlab.io

There is some bugs i think:

  digraph "CK-Build" {
      subgraph rank_0 {
          rank=0;
          "a";
      }
      subgraph rank_1 {
          rank=1;
          "b" -> "a";
      }
  }

On regular rendering, this does not render a box for the subgraph, plus, a and b are displayed in the same box, at least it should be in separated boxes.

Yeah, I also noticed that "graph-easy" seems to not handle ranks as expected. Also, the common box is strange

This is quite awesome. Can you make them shareable?

Done! This is the code change: https://github.com/ggerganov/dot-to-ascii/commit/1e5f818bbc3...

Nice work, thanks!

It should be relatively straightforward to implement this even without any server-side storage - serialize and urlencode the input to the URL hash and then read the hash on load. Modern browsers support very long URL hashes (~1MB in Firefox based on my test, even longer in Chrome)

If you have a Mac then Monodraw is pretty good for editing ASCII diagrams in general:

https://monodraw.helftone.com/

something went wrong when I changed subgraph cluster 0 to:

    subgraph cluster_0 {
        a0 -> a1 -> a2 -> a1;
        label = "process #1";
    }

This is super cool! Well done OP!

Can you do this on the command line with regular graphviz?

Not with graphviz but it calls to a Perl package called graph-easy which provides a command-line utility. So you could install and use that.