Tips & tricks for very large network graphs?

[guusdk]

Hi! I'm using VIS in a project that renders a large network graph (it currently has approximately 7,500 nodes and 9,000 edges). I've hacked together a solution based on the provided examples that ... works, but the performance is appalling.

I wonder if there are community members that can share tips and trick on how to apply the project to accommodate such large numbers.

[nicolasvallee]

Hi Guusdk!

Have you left the maxVelocity option to the default 50? You may want to try to increase it, at least at the start of the simulation, to let nodes travel the distance they need to.
The larger the graph, the further some nodes nee to travel and are automatically slowed down by the default velocity limit.

Let me know how that goes.

Best,

Nico

Edit: I assumed you used force atlas 2, which is what I am using and this is what I did to solve this issue. I have less experience with other layouts but it might actually be the same reason.

[guusdk]

I had indeed done that, thanks! We (somewhat arbitrarily) bumped it up to 200. I'm not reducing the velocity over time, but I do reduce the timestep value, as shown below. The results are ... meh.

const options = {
    physics: {
        solver: 'forceAtlas2Based',
        timestep: 1.0,
        stabilization: {
            iterations: 0,
            updateInterval: 200,
            fit: true
        },
        forceAtlas2Based: {
            gravitationalConstant: -100,
            damping: 0.8
        },
        maxVelocity: 200,
    },
    edges: {
        smooth: false
    }
};
const network = new vis.Network(container, data, options);

function reduceTimestep() {
    options.physics.timestep = options.physics.timestep - 0.1;
    network.setOptions(options);

    if (options.physics.timestep > 0.2) {
        setTimeout(reduceTimestep, 2000);
    } else {
        options.physics.timestep = 0.2
        network.setOptions(options);
    }
}

network.stabilize();
setTimeout(reduceTimestep, 2000);