Nodes overlapping Issue

[vivekdaryani]

I have applied forceAtlas2 layout to some of my graph nodes and have given fixed positions (x,y) to other nodes manually.
But nodes on which forceatlas2 is applied overlap the other nodes which have fixed position.

[vivekdaryani]

Guys, any updates on this ?

[Yomguithereal]

There is an issue somewhere that explains how to use the rendered size of the nodes for performing the overlap calculations rather than the absolute size of the nodes. But I have a hard time finding it back.

[apitts]

@Yomguithereal I believe these are the issues you are looking for:
#107
#613

Note: I have tried the suggestion myself and was unable to make it work. My current view is that we need a nooverlap algorithm like Gephi (see here: https://github.com/gephi/gephi/tree/master/modules/LayoutPlugin/src/main/java/org/gephi/layout/plugin/noverlap).

[Yomguithereal]

Thanks @apitts.

[vivekdaryani]

@Yomguithereal Is there any other approach which can work here ?

[Yomguithereal]

Have you enabled the adjustSizes option @vivekdaryani?

[vivekdaryani]

@Yomguithereal Yes

[Yomguithereal]

Then using the rendered size should produce the same results as Gephi's version. The thing is usually, people apply anti-collision at the end of the layout only.

[rangeonnicolas]

There seems to be a bug on the adjustSizes option of the ForceAtlas2 implementation, please see #613 (comment)

[apitts]

@rangeonnicolas Does this fix overlapping nodes for you after running the algorithm with adjustSizes set to true? I have tried (including using rendered node size) and I'm still seeing a lot of node overlap.

[rangeonnicolas]

@apitts Hello, Yes it fixed it.

Are you sure that these 2 option are taken into account?
sigma.settings.nodesPowRatio = 1;
sigma.settings.autoRescale = false;
I don't know much about configuring sigma , but I think these 2 line should be placed before instancing sigma. Or maybe it is possible to set these options when instancing a sigma class... I really don't know.
Here is how i did :

<script>
        sigma.settings.nodesPowRatio = 1;
        sigma.settings.autoRescale = false;

        ss = new sigma({
            renderer: {
                container: document.getElementById('container'),
                type: 'canvas',
                settings: {
                    defaultNodeColor: '#ec5148',
                    edgeColor: 'default',
                    defaultEdgeColor: '#ccc',
                    animationsTime: 5000,
                    drawLabels: false,
                    scalingMode: 'outside',
                    batchEdgesDrawing: true,
                    hideEdgesOnMove: true,
                    sideMargin: 1,

                }
            },
        });

        sigma.parsers.gexf('data.gexf',
            ss,
            function getAxes(s) {
                // Configure the ForceLink algorithm:
                var fa = sigma.layouts.configForceLink(s, {
                    worker: true,
                    autoStop: false,
                    background: false,
                    linLogMode: true,
                    adjustSizes: true,
                });

                // Start the ForceLink algorithm:
                sigma.layouts.startForceLink();
            });
        </script>

Of course, as I use ForceLink algorithm instead of ForceAtlas2, I modified the file /plugins/sigma.layout.forceLink/worker.js instead of /plugins/sigma.layout.forceAltas2/worker.js as said in rangeonnicolas@3c8a1e6 .

(ForceLink is a copy of ForceAtlas2 but with more options)

Tell me if it works for you ;) !

[apitts]

Thanks @rangeonnicolas! I will try to replicate your settings and see how I go.

[apitts]

No luck with this I'm afraid. I don't get any reduction in overlap with adjustSizes true (either with or without changing to use renderer prefix in the layout algorithm). What I see is essentially a much slower version of the regular algorithm...but no change in overlap.

[apitts]

@rangeonnicolas...how about with linLogMode set to false? LinLogMode will also have the effect of reducing / eliminating overlap but is clearly quite different.

[neil-rubens]

I had a similar issue overlapping nodes; and after a bit of strugling have found a solution that at least works for my case.

The root cause was due to the way sigma was doing sizing of the nodes. If your graph has nodes overlapping; you can just try to use the browsers zoom out feature; untill the nodes appear fine; in my case that was 67%.

Then you can create custom renderes (nodes, labels) that scale the size accordingly.

p.s. in my case the problem was due to user's having different resolutions. In that case scaling factor could be created dynamically by utilizing window.innerHeight

I hope this helps somebody.

other related issues:
#666 #107 #613

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.