Show HN: GraphvizAnim, a tool to create animated graphs, based on graphviz | Hacker News Reader

Show HN: GraphvizAnim, a tool to create animated graphs, based on graphviz

github.com

70 pointsmapio18 comments

This looks really similar to what you want to do but with d3 and interactive: http://maurizzzio.github.io/greuler/#/examples/dfs (click "run algorithm")

That's really nice! I like graphviz layouts because they use curved arcs (that sometimes make graphs look much better). How difficult would be to use it with d3?

The relevant algorithm is Sugiyama, and there's an unmaintained, but working plugin for d3 called dagre-d3.

Cool, I'm totally new to d3, but it seems very very interesting. It's nice to know that a good layout plugin is available. Thanks for the info!

I'm not complaining but interested - why does this not work on my iPhone? Safari does not support it? Phones in general do not provide some basic resource needed?

I have usually dismissed JavaScript fails on iPhones as one of those things, but it is hard to argue with the idea that the mobile world is now the predominant platform?

If I open the GitHub page on my iPhone I can see the graph animating. It's just an animated gif, so it should not really be a problem of Javascript at all (there is none involved). On the other hand, if you are trying to use the Jupyter notebook, I've no idea if it works on iPhone.

If you have a specific issue, can I please ask you to report it on GitHub Issues?

Thanks!

Coincidentally I released an experimental graph animation video using graph-tool for rendering and ffmpeg for conversion: https://www.youtube.com/watch?v=TywrMtBcgeI

The technique works well for engaging data visualization, although the code is somewhat tedious.

Are the ImageMagick commands included in your Python module? I took a look and didn't see a way to create the GIF. (EDIT: found it; it is the gif() function in render.py. I am dumb)

No, I am dumb and should comment the code (and provide few usage examples). I wrote it in a hurry yesterday night, it was just an hack and it ended up on the frontpage of HN.

You are not dumb. Releasing un-commented code that works is still releasing code that works.

This actually solves a problem I was having. Thanks for sharing it.

Bravo

No, you are awesome. Thank you!

I'm flattered (and blushing) :-)

Anyone who puts up something so useful on GitHub and is so nice as to apologise for not commenting their code is pretty awesome and deserves to be thanked. Honestly, showing you my appreciation is the very least I can do. Keep being great!

:-)

I really like the idea of animating graphviz graphs. It definitely helps to make them clearer.

I know it's a proof of concept but one suggestion would be to animate the line drawing itself. That's difficult if you're outputting a raster format but if you're feeling adventurous then you could output to SVG and draw the lines using the stroke-dashoffset trick:

https://css-tricks.com/svg-line-animation-works/

The `gvanim.jupyter` module is actually using SVG, so that would be awesome! Would you like to contribute? I'll be glad to accept a pull request :) I have opened an issue https://github.com/mapio/GraphvizAnim/issues/3 to keep track of your suggestion.

Probably off topic a bit - but is there any tool that will automatically analyze C++ code and create sequence diagrams?

I'm going to answer my own question:

https://github.com/animatedb/oovaide

Reply on news.ycombinator.com