Re: [cytoscapeweb-discuss] Target Node size

[Christian Lopes]

Hi,

Since this version of CW does not provide the node degree, here is one workaround you could try:

1) I guess you want to map node size to node degree, right? Cytoscape Web does not provide such information, so you would have to calculate it yourself. You could use the function fisrtNeighbors to calculate the degree of each node and then set a Discrete Mapper that maps the "degree" attribute to node "size" (Note: I haven't tested this code):

// Calculate the degree of all nodes right after the network is rendered

vis.ready(function () {

    // Get all nodes

    var nodes = vis.nodes();

    for (var i=0; i < nodes.length; i++) {

        var n = nodes[i];

        // Get first neighbors by node id

        var fn = vis.firstNeighbors([n.data.id]);

        // Calculate the degree

        // (actually, this is incorrect, as loops must be counted twice!)

        var degree = fn.edges.length;

        // Set the degree to the node as an attribute

        // (make sure the nodes schema has this field!!!)

        n.data.degree = degree; 

    }

    // Ask CW to update the data

    vis.updateData(nodes);

    // Now create a new visual style (or get the current one) and register

    // the continuous mapper to one or more visual properties:

    var style = vis.visualStyle();

    style.nodes.size = { continuousMapper: { attrName: "degree",  minValue: 24, maxValue: 72 } };

    // Finally set the visual style again

   vis.visualStyle(style);

});

2) Would be similar to #1, but use the visual property "opacity".

Thanks,

Christian

On Wed, Aug 15, 2012 at 9:45 AM, Jose DiBella <jose.d...@gmail.com> wrote:

Hi, I am new to using Cytoscape, and have found it very user friendly. 

I have a some quick query's. 1) how to make the size of the target node adjust according to the number of connections with source nodes (and vice-versa). 2) Is it possible to adjust the transparency of the color according to the number of connections? 3) Is there a resource to import additional visual styles?

This is my first time doing SNA, so it is taking me a little bit longer to learn the potential uses of the software.

thank you, 

[Hemang Gandhi]

Hi Christian,

I have tried calculating the node degree with your solution. It does work, but I have couple queries.

1) I have put your code in vis.ready(function () { } and I also had to add the degree data field before this else it was giving me error.

So this is my current code:

vis.ready(function(){
        var field = { name: "degree", type: "number", defValue: 24 };
        vis.addDataField("nodes", field);

       
        // Get all nodes
        var nodes = vis.nodes();
        for (var i=0; i < nodes.length; i++) {
            var n = nodes[i];
            // Get first neighbors by node id
            var fn = vis.firstNeighbors([n.data.id]);
            // Calculate the degree
            // (actually, this is incorrect, as loops must be counted twice!)
            var degree = fn.edges.length;
            // Set the degree to the node as an attribute
            // (make sure the nodes schema has this field!!!)
            n.data.degree = degree;
        }
        // Ask CW to update the data
        vis.updateData(nodes);
        // Now create a new visual style (or get the current one) and register
        // the continuous mapper to one or more visual properties:
        var style = vis.visualStyle();

        style.nodes.size = { continuousMapper: { attrName: "degree",  minValue: 30, maxValue: 80 } };

        // Finally set the visual style again
        vis.visualStyle(style);

        vis.removeListener("error", onDrawError);
        $("#metascape_container").trigger("available");
        //vis.removeDataField("nodes", field);
    });

Now the problem I have is, I am trying to export the network as xgmml or graphml and trying to import the same exported xgmml or graphml file to create the network. There is gives me error like, "Cannot add data field 'degree': data field name already exists", because the xgmml or graphml file contains attribute degree and since I already had to addDataField in the above code, it won't allow to do it again. Could you please suggest something on this?

2) Another query is, I am trying to sort the Circle layout into Degree Sorted Circle Layout, as we can do in the Cytoscape software. Now with your suggestion, I am able to show all the nodes with different sizes, I need to sort the layout in ascending order. Is there a way to do that in CytoscapeWeb?

3) Also can you suggest about how should I go with calculating and visualizing the network by Centrality, Betweenness, etc. like we can do using the CentiScaPe plugin with the Cytoscape software?

Thanks for your time.
-Hemang