Finding X and Y coordinates for nodes on the graph

[Pablo Lucena]

I've been doing some experimenting with autonetkit for building network diagrams based off live network data. One issue I've struggled with is getting nodes positioned on the graph so that it looks nice. I have tried using the x/y coordinates of graphs created by the networkx library such as "shell_layout", or "spring_layout", but the algorithm seems to fall apart with highly meshed networks. I am sure this is due to my lack of understanding of how to do this. This works well for networks with a few nodes (5-8) but when I add 30+ devices that are highly meshed (leaf/spine network) the diagram turns into a spider-web circle. The fact that muilti-edge lines are curved seems to intensify this effect as well. 

Does anyone have some insight/experience on automatic node placement within autonetkit? Additionally, how are things like text font settings or other graphical settings configured? 

Thanks

[Simon Knight]

I've always found it really hard to find a graph layout algorithm that
I've been happy with. I've always stuck with using the node positions
that were drawn on the input topology.
But this doesn't always work when you're visualising a live network.
I don't think it's your lack of understanding so much as it being a
reasonably challenging problem.

There was a recent Hacker News thread discussing this sort of graph
layout problem. It looks like dagre-d3 was popular
https://news.ycombinator.com/item?id=9325024 with some examples on
https://github.com/cpettitt/dagre-d3/wiki

It shouldn't be too hard to use this as the layout algorithm.

When you say leaf/spine, is there inherent structure there? Perhaps
using a hierarchical layout algorithm would help.
You could try turning down the radius of the multi-edge lines so
they're closer to straight lines and see if that helps. Let me know if
you're interested and I'll dig up the relevant code sample.

Font settings and other graphical settings are in the code at the
moment - there's no separate configuration file for these. It's all
driven by d3 so it's not too hard to tweak them.

The code isn't elegant at the moment. It could do with a cleanup at
some point. I haven't touched the code in a while since we switched
over to using a Cisco visualisation engine for VIRL.



Thanks

> --
> You received this message because you are subscribed to the Google Groups
> "AutoNetkit" group.
> To unsubscribe from this group and stop receiving emails from it, send an
> email to autonetkit+...@googlegroups.com.
> For more options, visit https://groups.google.com/d/optout.

[Pablo Lucena]

Hello Simon,

I will take a look at using some of the algorithms you mentioned to position the nodes, and will dig into the d3 to look for the relevant d3 font settings.  I also notice that in some of your examples the circles drawn around the routers come in different colors. When I launch "ank_webserver ank_vis" and get the default topology displayed, the circles around the nodes are all the same color - gray. Is this also driven by d3?

 By leaf and spine I mean a data center network with 2 spine nodes at the top connected to all leafs at the bottom. Each leaf has two connections into each spine, and the spines are interconnected as well - a typical 3 stage CLOS, with the spine nodes interconnected. I certainly would like to try tuning down the radius of the multi-edge lines to see if it helps.

Thanks for your help,