cytoscape中不同組邊緣的不同顏色代碼

Question

我是新來的cytoscape，但我正在研究使用cytoscape.js來顯示多個航空公司的拓撲結構。我需要顯示這些航空公司的兩個國家之間的航班。我的計劃是創建一個cytoscape實例。對於每家航空公司，創建邊和節點，並指定樣式。在樣式中，我想指定邊的顏色。但是，我無法看到每次迭代所分配的不同顏色編碼。取而代之的是，所有邊緣和節點，得到相同的顏色，這在最後iteration.Here分配是我的代碼，

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)' 
      } 
     }]); 
} 

有人可以幫我找出whats回事錯在這裏？

Answer 1

您在每次迭代中覆蓋整個樣式表。只需在init中設置樣式表並使用映射器即可。閱讀文檔樣式部分的樣式表信息：http://js.cytoscape.org/#style