Show elements in node's neighborhood

[AjitPS]

Is there a way to show elements present in a selected node's neighborhood if they were hidden before ? I tried many approaches using the .neighborhood() function but none of them seem to work. Further details can be found here: http://stackoverflow.com/questions/28769541/cytoscapejs-display-selected-nodes-neighborhood

[maxkfranz]

You've probably made your stylesheet work against you. You ought not to use .show() etc unless you're OK with using overridden styles on display: http://js.cytoscape.org/#collection/style/eles.show

Otherwise, use a class in your stylesheet.

[AjitPS]

Hi Max, my code has functionality to hide nodes one at a time (via this.hide(); ) and a "Show All" button that shows everything: var cy= $('#cy').cytoscape('get'); cy.elements('node').show(); cy.elements('edge').show();

What I want is to have a "Show neighbourhood" button instead of "Show All", that allows all hidden nodes just in the selected node's neighborhood to be displayed.

Is using .show() and hide() not ideal ? How would I achieve this by using a class ?

[AjitPS]

Hi Max, I'm not sure why this doesn't work.

I have a dataset in JSON format containing information about nodes and edges which I am using to generate a network graph in cytoscapeJS. The JSON data contains id, value, shape, colour and visibleDisplay ('element' or 'none') attributes for nodes and id, source, target and label for edges. My stylesheet uses this 'visibleDisplay' property to show/ hide nodes, as needed, when the cy container is first initialised.

I want to allow users to unhide nodes with an option to "Show neighbourhood". I have modified my old code to make use of collections (without using .neighborhood()) but it still does not work:

function showNeighbourhood() { var eleID; var neighbourArray= new Array(); var neighbours= cy.collection(); // collection

cy.nodes().forEach(function( ele ) { if(ele.selected()) { // get the currently selected node. eleID= ele.id(); } });

// Find its connected neighbours. cy.edges().forEach(function( edg ) { if(edg.data('source') === eleID) { neighbourArray[neighbourArray.length]= edg.data('target'); } else if(edg.data('target') === eleID) { neighbourArray[neighbourArray.length]= edg.data('source'); } });

// Add the array to the collection. neighbours.add(neighbourArray);

// Show neighbourhood, using the collection. neighbours.show(); }

Any suggestions on how to make this work ? Can't I use the show() method on the collection to make the required nodes visible ? Further info. at http://stackoverflow.com/questions/28769541/cytoscapejs-display-selected-nodes-neighborhood

[maxkfranz]

Maybe you should post your question to Stackoverflow? I don't think there's a bug related to this in Cy.js, so that may be a better place to get help debugging your code.

[AjitPS]

Hi Max, thanks for your reply. I will do that.

However, it would be very helpful for potential CytoscapeJS users if there were some simple examples in the Demos showing usage of graph manipulation (using collections), style (via classes), selectors, traversing (neighborhood), etc. like there are for using the cy core. Thanks.

[maxkfranz]

Edit: mispaste; proper link : http://jsbin.com/gist/aedff159b0df05ccfaa5?js,output