How to modify the nodes features in Gradient1 style in Cytoscape?

Question

[Farah]

Hello,

After importing the proteins interactions output of String database, which is an TSV file, into Cytoscape, I used Gradient1 Node Style for my network, because I needed to have nodes in 3D style similar to Stringdb style (with both black shadow and white specular highlight over nodes). But, It seems that with Gradient1 style, I can not modify node features such as node color (which I need). May I kindly ask you to guide me that with Gradient1 style, how can I make my selected nodes with different colors?

Or if you can give me any other suggestions that I can have my nodes style as 3D with ability to modify node and edge features (such as node color, size,...).

I would highly appreciate your great help.

Answer 1

[xanderpico]

As you have already discovered, there are a few different ways to get the 3D style, each with their own limitations.

1. Gradent 1 Style uses the Custom Graphics capabilities built-in to Cytoscape. You can explore this by clicking on the default setting for the Image/Chart 1 visual style property which defines a radial gradient for all nodes. This effectively places an image on top of each node. Thus, any colors defined by the Fill Color property, for example, will be hidded underneath and not visible.

2. stringApp uses the enhancedGraphics app for Cytoscape to define semi-transparent PNG images to overlap on top of each node. When looking at a network built using the stringApp, you can find this PNG information in the Node Table column, "stringdb::STRING style". It is also mapped to via the Image/Chart 1 property, but using enhancedGraphics rather than the built-in CustomGraphcs. Since this PNG is semi-transparent, it can show the underlying Node Fill colors.

So, if you want to overlap a custome image on nodes and still see the Node Fill colors underneath, then approach #2 is the only option. You can "borrow" the syntax, including the glass bauble PNG effect, from one of the STRING style columns and paste that into any network you want. Then copy it to all rows (right-click function). Then map it as a passthrough in an Image/Chart property. You also have to have enhancedGraphics app installed (which you already do if you've used the stringApp before). Then it should work the same way for you!

We have a tutorial covering some use cases for CustomGraphics and enhancedGraphics here: https://cytoscape.org/cytoscape-tutorials/protocols/custom-enhanced-graphics-style/#

[Farah]

Thank you very much dear xanderpico, and so sorry for my late response as I did not receive any emails or notifications regarding the answer to my question. Many thanks for your guide and help. Best wishes,