47 ms·

Greuler – Graph theory visualizations

172 points by shawndumas 11y ago

dikaiosune 11y ago
Very cool! I was lazily working on something similar for a project, and might be able to drop this in and save a ton of time. If the author reads this, might I suggest some examples using the label attributes of nodes and edges? It'd be great to see a graph annotated (potentially with some image or link tags embedded for further browsing?).
- maurizzzio 11y ago
  thanks! right now I'm working on more examples where the information on the edges is used like finding the minimum spanning tree or the shortest path from a source vertex, I'd suggest to open a new ticket in the repo issues section so I can take a look at it later, thanks for the feedback
TheGrassyKnoll 11y ago
I counted six cycles ? 6,7,8,6 8,0,3,4,9,8 0,5,1,0 0,1,3,0 (are these not considered separate cycles ?) 8,0,5,1,3,4,9,8 0,5,1,3,0 Anyway, very nice presentation.
- maurizzzio 11y ago
  you're right hehe I should rename the problem to finding the number of back edges in the dfs tree, thanks for the feedback
cschmidt 11y ago
Looks nice. I do find the headlines drawing themselves a letter at a time to be kind of distracting. I makes it hard to scan down the page, as the headlines aren't there.
- comrh 11y ago
  It is like the web version of the typewriter animation in powerpoint.
- michaelmior 11y ago
  Agreed. The font choice was also very odd. Everything else looks incredibly cool though!
  - maurizzzio 11y ago
    hehe yep I should've chosen a better font
fait 11y ago
Cool. Any way I could connect my Neo4j API and visualize the db or individual requests?
- rn222 11y ago
  This would be great.
- rudolf0 11y ago
  Yes, this would be excellent. Most people who would be using this in a serious way would likely run the bulk of their queries on the serverside in their graph DB, and then perhaps allow a bit of graph manipulation in the browser just to visualize the results for users. Some kind of hooking of a graph DB API would make this perfect.
maurizzzio 11y ago
thanks for the submission OP!
- shawndumas 11y ago
  no problem; thank you for something submission worthy.
compostor42 11y ago
Wow, this is slick! Would love to use this to visualize a min/max algorithm. A nice way to demonstrate graph algorithms, as you have already shown!
alexisnorman 11y ago
Awesome! I'm currently piecing together teaching material for an intro to algorithms class and this is excellent. Right about to implement Bellman-Ford's and Dijkstra's.
_lce0 11y ago
love it!! I am looking for a tool to construct a PERT visualization, but it require to be a activity-on-node type of graph does Greuler allows to construct such type of graphs?
- maurizzzio 11y ago
  I'm sure you can do it, the layout is powered by WebCola which has an example of a DAG: http://marvl.infotech.monash.edu/webcola/examples/downwardedges.html http://marvl.infotech.monash.edu/webcola/examples/downwarded..., greuler is more like a tool that provides the necessary methods to interact with the nodes/edges of the graph in a nice way
degenerate 11y ago
Whenever I see a new graph visualization tool, I instantly start dragging the nodes around like a madman to see how well the graph "balances" in the viewport. I soon noticed there was a tutorial was running while I was manipulating the position of the nodes, and regardless of how much stretching and pulling I did to try breaking the tutorial, it worked flawlessly as if I wasn't even touching it. That, I thought, was really awesome. Well done!
- __float 11y ago
  This actually is the power of the algorithm behind webcola, not totally anything greuler does. Still cool though :)
lotophage 11y ago
This is an entirely personal opinion, but as nice as it is, I find the font painfully difficult to read.
- maurizzzio 11y ago
  Indeed, I've changed the font, idk what I was thinking hehe
leni536 11y ago
Really nice. One nitpick: I can drag the graphs out of the svg frame and then they are lost forever. It would be nice if there was an attraction toward the center of the frame or there would be walls that wouldn't let this happen.
pmall 11y ago
How many nodes/edges can be handled by this ? I'm working with graphs with hundreds of node/edges.

172 points by shawndumas 11y ago

Very cool! I was lazily working on something similar for a project, and might be able to drop this in and save a ton of time. If the author reads this, might I suggest some examples using the label attributes of nodes and edges? It'd be great to see a graph annotated (potentially with some image or link tags embedded for further browsing?).

maurizzzio 11y ago
thanks! right now I'm working on more examples where the information on the edges is used like finding the minimum spanning tree or the shortest path from a source vertex, I'd suggest to open a new ticket in the repo issues section so I can take a look at it later, thanks for the feedback

TheGrassyKnoll 11y ago

I counted six cycles ? 6,7,8,6 8,0,3,4,9,8 0,5,1,0 0,1,3,0 (are these not considered separate cycles ?) 8,0,5,1,3,4,9,8 0,5,1,3,0 Anyway, very nice presentation.

maurizzzio 11y ago
you're right hehe I should rename the problem to finding the number of back edges in the dfs tree, thanks for the feedback

cschmidt 11y ago

Looks nice. I do find the headlines drawing themselves a letter at a time to be kind of distracting. I makes it hard to scan down the page, as the headlines aren't there.

comrh 11y ago
It is like the web version of the typewriter animation in powerpoint.
michaelmior 11y ago
Agreed. The font choice was also very odd. Everything else looks incredibly cool though!
- maurizzzio 11y ago
  hehe yep I should've chosen a better font

fait 11y ago

Cool. Any way I could connect my Neo4j API and visualize the db or individual requests?

rn222 11y ago
This would be great.
rudolf0 11y ago
Yes, this would be excellent. Most people who would be using this in a serious way would likely run the bulk of their queries on the serverside in their graph DB, and then perhaps allow a bit of graph manipulation in the browser just to visualize the results for users. Some kind of hooking of a graph DB API would make this perfect.

maurizzzio 11y ago

thanks for the submission OP!

shawndumas 11y ago
no problem; thank you for something submission worthy.

compostor42 11y ago

Wow, this is slick! Would love to use this to visualize a min/max algorithm. A nice way to demonstrate graph algorithms, as you have already shown!

alexisnorman 11y ago

Awesome! I'm currently piecing together teaching material for an intro to algorithms class and this is excellent. Right about to implement Bellman-Ford's and Dijkstra's.

_lce0 11y ago

love it!! I am looking for a tool to construct a PERT visualization, but it require to be a activity-on-node type of graph does Greuler allows to construct such type of graphs?

maurizzzio 11y ago
I'm sure you can do it, the layout is powered by WebCola which has an example of a DAG: http://marvl.infotech.monash.edu/webcola/examples/downwardedges.html http://marvl.infotech.monash.edu/webcola/examples/downwarded..., greuler is more like a tool that provides the necessary methods to interact with the nodes/edges of the graph in a nice way

degenerate 11y ago

Whenever I see a new graph visualization tool, I instantly start dragging the nodes around like a madman to see how well the graph "balances" in the viewport. I soon noticed there was a tutorial was running while I was manipulating the position of the nodes, and regardless of how much stretching and pulling I did to try breaking the tutorial, it worked flawlessly as if I wasn't even touching it. That, I thought, was really awesome. Well done!

__float 11y ago
This actually is the power of the algorithm behind webcola, not totally anything greuler does. Still cool though :)

lotophage 11y ago

This is an entirely personal opinion, but as nice as it is, I find the font painfully difficult to read.

maurizzzio 11y ago
Indeed, I've changed the font, idk what I was thinking hehe

leni536 11y ago

Really nice. One nitpick: I can drag the graphs out of the svg frame and then they are lost forever. It would be nice if there was an attraction toward the center of the frame or there would be walls that wouldn't let this happen.

pmall 11y ago

How many nodes/edges can be handled by this ? I'm working with graphs with hundreds of node/edges.