
Greuler – Graph theory visualizations - shawndumas
http://maurizzzio.github.io/greuler/
======
degenerate
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
This actually is the power of the algorithm behind webcola, not totally
anything greuler does. Still cool though :)

------
cschmidt
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.

~~~
michaelmior
Agreed. The font choice was also very odd. Everything else looks incredibly
cool though!

~~~
maurizzzio
hehe yep I should've chosen a better font

------
dikaiosune
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
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

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

------
leni536
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.

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

~~~
rudolf0
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.

------
alexisnorman
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.

------
TheGrassyKnoll
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
you're right hehe I should rename the problem to finding the number of back
edges in the dfs tree, thanks for the feedback

------
compostor42
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!

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

~~~
maurizzzio
Indeed, I've changed the font, idk what I was thinking hehe

------
maurizzzio
thanks for the submission OP!

~~~
shawndumas
no problem; thank you for something submission worthy.

------
eridal
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
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/downwarded...](http://marvl.infotech.monash.edu/webcola/examples/downwardedges.html),
greuler is more like a tool that provides the necessary methods to interact
with the nodes/edges of the graph in a nice way

