Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Shaky: ASCII Diagram to PNG

shaky.github.bushong.net

Post reply on HN
Print view View original

51–60 of 72 posts

Re: Shaky: ASCII Diagram to PNG

#51

Post by vidarh »

davidjgraph wrote: post #49
vidarh wrote: post #30

Earlier quoted context omitted.

Now you then need to cut and paste back and forth from your documents in order to edit them.

Not if you import that format as well, that's not impossible to implement.

If you come up with a tool that will pick up on a diagram in a readable ascii format in the middle of a document, let me edit it, and then patch in the updated diagram without making any kind of changes to other portions of the file, then we'd be getting somewhere.

Even then there'd be issues, as e.g. I might want to modify descriptions elsewhere in the file in between modifying the diagram. As a concrete example, I am doing that these days with a spec for a system I'm planning. I'm using a custom Markdown based processor with a filter that takes Graphviz/dot syntax inline, and while I edit the diagram, I'll also then often want to write something about what I've added to it. So if I was going to use an external program, the roundtrip from text editor -> diagram editor -> text editor would need to be very fast and smooth.

Though to be really useful for me, it'd need to work for me via an ssh connection as well...

It's really hard to beat plain text for some of these use-cases. At least without first getting more graphics capabilities back into our terminals.

Re: Shaky: ASCII Diagram to PNG

#52

Post by ygra »

bnegreve wrote: post #31
ygra wrote: post #27

Earlier quoted context omitted.

Uhm, if the only thing you base that assumption on is the use of -> to mark a line with an arrowhead ... sure. But it's pretty far from dot, actually.

They are similar in that they are both languges that can be used to specify diagrams.

dot describes graphs. Sequence diagrams aren't really graphs in my book.

Re: Shaky: ASCII Diagram to PNG

#53

Post by zwischenzug »

bphogan wrote: post #17
dr_zoidberg wrote: post #14

Earlier quoted context omitted.

I think the appeal would be that, since it's text based, it's already supported by git/mercurial/svn/name-your-vcs. A binary format would need some sort of history/diff support inside it to work well with a specific plugin for s VCS. An XML-based format would integrate well with a VCS, but you lose the clarity of the ASCII based diagrams. It may seem "cute" or "toyish", but I woudl try to use it before giving an opin…

This. I would love, as an author and teacher, to keep my flowcharts, diagrams, etc with my book code. Right now I'm using SVG for that, but it's kinda rotten.

I use draw.io, and export to xml.

Re: Shaky: ASCII Diagram to PNG

#54

Post by mraleph »

davidjgraph wrote: post #7

These ideas always seem to top HN. They are cute, but interactive diagram editors have been around a while and, unfortunately, are just faster to use and are more flexible. Maybe it'd make more sense to just have one of these tools implement export to ACSII?

I wrote the original code (not this CoffeeScript port) so that I could create simple diagrams fast without resorting much to dragging stuff around with mouse. If you want to create a sequence of diagrams where each next one is just slightly different from the previous one then textual approach is simply superior to point-and-click style editing. Other parts of my motivation were outlined here[1].

Having this ASCII -> image converter also allows me to embed diagrams into blogposts as text without actually making images out of them. See [2] as an example of such embedding.

[1] http://mrale.ph/blog/2012/11/25/shaky-diagramming.html [2] http://mrale.ph/blog/2014/07/30/constructor-vs-objectcreate....

Re: Shaky: ASCII Diagram to PNG

#55

Post by _puk »

AstroJetson wrote: post #18

I use this tool almost every day turning sequence diagrams into drawings. https://www.websequencediagrams.com While the "back of a napkin"style is hip, management seems to prefer cleaner drawings. I'd use shakey, if it made "professional" drawings.

You can use the &s param (or the dropdown..) to change the style of the image created by websequencediagrams.

&s=napkin for yourself.

&s=omegapple for management.

Re: Shaky: ASCII Diagram to PNG

#56

Post by vidarh »

AstroJetson wrote: post #18

I use this tool almost every day turning sequence diagrams into drawings. https://www.websequencediagrams.com While the "back of a napkin"style is hip, management seems to prefer cleaner drawings. I'd use shakey, if it made "professional" drawings.

From a quick look at the code for Shaky, getting "cleaner" drawings would only require replacing 2 functions (shakyLine and bulb). In "bulb" it'd just require removing one line and changing one. In shakyLine you'd need to strip out most of it and replace it with a 1-2 line version.

Re: Shaky: ASCII Diagram to PNG

#57

Post by dr_zoidberg »

maaaats wrote: post #45
dr_zoidberg wrote: post #14

Earlier quoted context omitted.

I think the appeal would be that, since it's text based, it's already supported by git/mercurial/svn/name-your-vcs. A binary format would need some sort of history/diff support inside it to work well with a specific plugin for s VCS. An XML-based format would integrate well with a VCS, but you lose the clarity of the ASCII based diagrams. It may seem "cute" or "toyish", but I woudl try to use it before giving an opin…

Try removing one of the left boxes (not exactly easy in this format) and then view the git diff. Think about trying to fix a conflict with that!

Indeed, side-by-side boxes editing/merging would be messy! But it still looks that something that could be integrated into a reasonably organized repository. Not the best of tools, but better than the alternative?

Re: Shaky: ASCII Diagram to PNG

#58

Post by atombender »

vidarh wrote: post #37
grhmc wrote: post #32

My impression is most people don't know about graphviz and dot, and implement these sorts of tools to fill this (admittedly big) gap.

Graphviz is great if you either want to automatically generate diagrams of huge graphs, or if you care more about structure than appearance. But creating pretty diagrams with Graphviz/dot is an exercise in pain. I love seeing more of these tools, and plan to integrate several of them in the scripts I use to build my blog, not to supplant the cases where I use Graphviz, but to augment them for the many situations wher…

I use Mermaid [1]. It has similar layout algorithms as Graphiviz/dot, and is significantly prettier out of the box.

Mermaid has multiple renderers (including a client-side JavaScript one), including SVG, so you can trivially style all your diagrams using CSS. It can also process diagrams embedded in Markdown.

That said, just like Graphviz, its weak points is "messy" diagrams. But it supports subgraphs, which can help making them cleaner.

[1] https://github.com/knsv/mermaid

Re: Shaky: ASCII Diagram to PNG

#60

Post by willvarfar »

vidarh wrote: post #43
willvarfar wrote: post #12

The 'drawn' -style output is cute. Would be nice if there were dot renderers that did 'artistic' renderings of diagrams.

Dot has a SVG output mode that's reasonably easy to tweak/manipulate. I did an XSL file that adds gradients and drop-shadows to the Dot output back in the day [1] and there are a number of annoying corner cases to deal with, but it's not too horrible; would've been easier in something other than XSL though. [1] https://github.com/vidarh/diagram-tools

Very nice! I've used little .ps icon files before, and been generally unhappy with the whole thing.

At its heart, graphviz is great. But the tools so need a nice little modernizing.

At the basic level, I found myself being very repetitive because its not possible for graphviz nodes to inherit attributes from others etc. No CSS kind of hierarchy.

Post reply on HN