Remove all the instance from sigma.js

There's surely a better way to do this, but I have the same problem. I solved it by completely removing the DOM element containing the graph, and then recreating it:

HTML:

<div id="graph-container">
    <div id="graph"></div>
</div>

JavaScript:

var sigma_graph = null; 

function create_graph() {
    sigma_graph = new sigma({ ... });
    ... populate graph ... 
}

function refresh_graph() {
    // to delete & refresh the graph
    var g = document.querySelector('#graph');
    var p = g.parentNode;
    p.removeChild(g);
    var c = document.createElement('div');
    c.setAttribute('id', 'graph');
    p.appendChild(c);

    create_graph(); 
}

Note that I'm not using jQuery, otherwise it would have been something like:

$('#graph').remove(); 
$('#graph-container').html('<div id="graph"></div>'); 

While this method seems to work, I can't say if it's a good idea or not. (I'm using the canvas renderer, if that matters.)


You can re-use instances of sigma, you don't need to kill the instance completely. I had the same problem and this is how I solved it. Just have one sigma instance and clear it whenever you want a new graph.

s = new sigma({...});

//do stuff with the graph.

function clear_graph() {
    //this gets rid of all the ndoes and edges
    s.graph.clear();
    //this gets rid of any methods you've attached to s.
    s.graph.kill();
};