Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Set Node Size with the amount of edges in cytoscape.js

Tags:

cytoscape.js

I'm trying to draw a molecular similarity network using cytoscape.js. I want to set node size to the amount of edges in network. Now I have network data as JSON Format. I want to now that how set each node size using node degree. Any help is appreciated.

Thanks

like image 346
iwatobipen Avatar asked Jul 30 '14 13:07

iwatobipen


People also ask

How do I change the size of the node in Cytoscape?

There are a few ways to set the sizes of selected nodes in Cytoscape: While selected, you can open the Style tab and set a "bypass" value for Node Size (the third column of settings). This will override any default or mapped values (the first two columns).

How do I change the node shape in Cytoscape?

In the style control panel, click on the little triangle next to Shape to expand the selector, then select a column, select discrete mapping as mapping type then select a shape for each category of nodes.

How many nodes can Cytoscape handle?

¶ Cytoscape is able to display large networks (> 10,000 nodes) while maintaining interactive speed.


1 Answers

In your stylesheet, you can define the style according to degree.

e.g.:

node[[degree = 0]] { /* ... */ }
node[[degree >= 1]][[degree <= 3]] { /* ... */ }
node[[degree >= 4]] { /* ... */ }

Refer to the data selectors and use the [[metadata]] double square brackets.

If you need more precision (i.e. on the JS code level rather than the stylesheet level):

If your graph is static, you could add a degree data attribute to each node and use a mapper in your stylesheet with that attribute. If your graph is dynamic, you could use the same approach but update the degree attribute as the graph is modified.

like image 75
maxkfranz Avatar answered Sep 28 '22 18:09

maxkfranz