Kroki – Convert plain text diagrams to images(kroki.io)
kroki.io
Kroki – Convert plain text diagrams to images
https://kroki.io/
28 comments
Thanks so much for your comment. I've just read (and played around with) your waveguide synthesis article, which led me down the rabbit hole of Sporth, ChucK, Soundpipe and now I find myself really excited looking over the contents of the "Physical Audio Signal Processing" book. I am going to learn a lot of new stuff today, thanks!
That's great to hear and exactly why the article exists. I'd say the DAFX papers are the best rabbit hole in this field: http://ant-s4.unibw-hamburg.de/dafx/paper-archive/search.php...
(And this is not entirely derailing the thread, since many of these papers are full of block diagrams, and a tool to generate nice DSP diagrams from text would be pretty useful)
(And this is not entirely derailing the thread, since many of these papers are full of block diagrams, and a tool to generate nice DSP diagrams from text would be pretty useful)
I can tear through backs of napkin, but typing a diagram usually stalls me out, even though I'm pretty fast on a keyboard and the specifications seem pretty simple.
Is it just my lack of practice, or is diagramming on a keyboard always awkward and slow? Or... do people generally surpass their freehand speed with enough practice, like with typing?
If not, is the ideal solution here a digital pen or wacom tablet with diagram detection / normalization software? Scanned napkins to mechanical turk? Something else?
Note: No disrespect though, the link is an amazing project for those that must type charts.
Is it just my lack of practice, or is diagramming on a keyboard always awkward and slow? Or... do people generally surpass their freehand speed with enough practice, like with typing?
If not, is the ideal solution here a digital pen or wacom tablet with diagram detection / normalization software? Scanned napkins to mechanical turk? Something else?
Note: No disrespect though, the link is an amazing project for those that must type charts.
I think you meant this as a top level comment, not a reply to mine. But yes, nothing beats a napkin in terms of speed.
> Turns out most of them give ridiculous layouts as soon as you have loops
Could you share an example? GraphViz should handle loops easily.
Could you share an example? GraphViz should handle loops easily.
Once again, my use case is DSP block diagrams. I guess "ridiculous" is a bit strong, but the results certainly didn't look like what you generally find in this context. You can look at the diagrams in the link I gave for an idea of the kind of layout I was trying to achieve.
Yeah when you have requirements around layout graphviz gets a bit hairy. It's still doable with rank directives and invisible nodes, but that's the point where I start to think if I shouldn't do it another way (e.g. in this case I'd probably have done an ascii diagram rendered).
digraph G {
rankdir=LR
node [shape=rectangle]
// nodes declared in order of horizontal position ("rank")
exciter
filter
subgraph H {
// nodes at the same horizontal rank
rank=same
plus [label="+"]
// invisible node for layout purposes
p1 [width=0, height=0, margin=0, label=""]
}
subgraph I {
rank=same
delay
nl
}
subgraph J {
rank=same
filter_ [label="filter"]
p2 [width=0, height=0, margin=0, label=""]
}
out
exciter -> filter -> plus -> delay -> filter_ -> out
filter_ -> p2 [arrowhead=none]
p2 -> nl -> p1 [arrowhead=none]
p1 -> plus
}
Nice! Thanks for sharing your graphviz-fu, that's actually not as hairy as I thought it would be, and the result is neat enough. I do remember playing with subgraphs and ranks when testing graphviz, but I gave up before getting this far. I'll try applying those techniques to more complex diagrams, and if I find it workable, I might just switch to that.
This is neat! I might actually be using this soon.
On a related note, CS professor John Regehr recently collected a bunch of ASCII-art diagrams from various source code into a blog post [0]. (The relation is that I had initially thought Kroki would be for things like this due to a faulty assumption of what the title meant by "plain text diagrams".)
[0] https://blog.regehr.org/archives/1653
On a related note, CS professor John Regehr recently collected a bunch of ASCII-art diagrams from various source code into a blog post [0]. (The relation is that I had initially thought Kroki would be for things like this due to a faulty assumption of what the title meant by "plain text diagrams".)
[0] https://blog.regehr.org/archives/1653
Thanks for sharing this blog post.
Svgbob is doing a pretty good job at converting those diagrams:
https://demo.kroki.io/svgbob/svg/eNrFlEtvgkAQx-_9FBNPGqJiHxc...
https://demo.kroki.io/svgbob/svg/eNrFlEtvgkAQx-_9FBNPGqJiHxc...
Oh wow, that's super cool! I'll have to tell John about that! I know he posted a follow-up tweet where he was playing with converting them using another tool, I think [0]. Neat stuff for sure.
[0] http://buttersquid.ink
[0] http://buttersquid.ink
This is a cool service, congratulations for shipping!
Reading through the docs I stumbled upon "All the code is available on GitHub and our goal is to provide Kroki as a free service.". There has been definitely a good amount of work spent to build it, and there will be ongoing maintenance and infrastructure costs. Maybe I'm too naive, but how does the Kroki team plan to make the product financially sustainable?
Reading through the docs I stumbled upon "All the code is available on GitHub and our goal is to provide Kroki as a free service.". There has been definitely a good amount of work spent to build it, and there will be ongoing maintenance and infrastructure costs. Maybe I'm too naive, but how does the Kroki team plan to make the product financially sustainable?
From their install page :
"Kroki is available as a Self-Managed instance.
We are also actively looking for sponsors to provide Kroki as a free service."
This looks really neat! This integrated with something like https://hackmd.io/ would be really great for technical writing . It could also be great for auto-generating docs or the like, so it's great to have this be standalone.
This looks awesome, essentially like pandoc for diagrams. Looking forward to checking it out!
You could create images from graphviz for quite long time.
http://www.webgraphviz.com/
That's true but Kroki is not limited to GraphViz.
We support more than a dozen diagram libraries: https://kroki.io/#support
Maybe you also want to try Edotor:
https://edotor.net
Disclaimer: I'm the author.
https://edotor.net
Disclaimer: I'm the author.
[deleted]
Are they easily embeddable, eg, on GitHub?
relatively... you can make a base64 encoding of the graph and have a png link like https://demo.kroki.io/graphviz/png/eNpLyUwvSizIUHBXqPZIzcnJ1...
Integration into Jupyter would be awesome.
Wow!! Great tool for product managers as well.
I wanted to write the articles in Markdown and include the diagrams in there, so text-to-diagram tools seemed ideal. Turns out most of them give ridiculous layouts as soon as you have loops, with limited options to correct this. Other are based on ASCII art, so you control the overall layout, but the result usually has massive, awkward padding between everything. And then there's the holy grail, LaTeX with TikZ/PSTricks, which can give perfect results, but the time investment was a little discouraging. Result: I ended up making the diagrams with a good old SVG editor.
[1]: https://www.osar.fr/notes/waveguides/