anderer Farbcode für verschiedene Kantengruppen in Cytoscape

Question

Ich bin neu in cytoscape, aber ich untersuche cyoscape.js, um die Topologie mehrerer Fluggesellschaften anzuzeigen. Ich muss Flüge zwischen zwei Ländern dieser Fluggesellschaften anzeigen. Mein Plan ist, eine Cytoscape-Instanz zu erstellen. Erstellen Sie für jede Fluggesellschaft Kanten und Knoten und geben Sie den Stil an. Im Stil möchte ich Farbe für Kanten angeben. Ich kann jedoch nicht für jede Iteration eine andere Farbcodierung erkennen. Stattdessen werden alle Kanten und Knoten, die gleiche Farbe erhalten, die in der letzten iteration.Here zugeordnet ist mein Code,

var cy = cytoscape({   
    container: document.getElementById('cy'), 
    elements: [ 
     { data: { id: 'a' } }, 
     { data: { id: 'b' } }, 
     { 
      data: { 
      id: 'ab', 
      source: 'a', 
      target: 'b' 
      } 
     }], 
    style: [ // the stylesheet for the graph 
    { 
     selector: 'node', 
     style: { 
      'background-color': '#666', 
      'label': 'data(id)' 
     } 
    }, 
    { 
     selector: 'edge', 
     style: { 
      'width': 1, 
      'line-color': '#aaa', 
     } 
    } 
]});  


var colors = ["blue", "black"];   
for(var i = 0; i < selectedAirlines.length; i++) 
{ 
    nodeCount ++; 
    cy.add({ 
    data: { id: 'node' + i } 
    }); 
    var source = 'node' + i; 
    cy.add({ 
     data: { 
      id: 'edge' + i, 
      source: source, 
      target: (i% 2 == 0 ? 'a' : 'b') 
     } 
    }); 
    cy.style([ 
     { 
      selector: 'node', 
      style: { 
       shape: 'hexagon', 
       'background-color': colors[i], 
       label: 'data(id)' 
      } 
     }]); 
} 

Kann mir jemand helfen, um herauszufinden, was falsch ist hier los?

Answer 1

Sie überschreiben das gesamte Stylesheet bei jeder Iteration. Setzen Sie das Stylesheet einfach auf init und verwenden Sie Mapper. Lesen Sie den Style-Abschnitt der Dokumentation für Stylesheet-Informationen: http://js.cytoscape.org/#style