在cytoscape.js中通過cy.add（）添加多個邊后使用mapData（）

Question

我正在使用cytoscape.js將原始txt數據轉換為cytoscape.js圖。 為此，首先我用： var cy = cytoscape({...})沒有任何元素的圖。然后從txt文件讀取節點和邊后，我將其與此添加到節點中：

        cy.add({
            data: {id: keys[i]}
        }
    );

這對於邊緣：

        cy.add({
        data: {
            id: 'edge' + i,
            source: edges[i].source,
            target: edges[i].target,
            label: edges[i].weight
        }

    });

然后我想應用'width': 'mapData(weight, 0, 100, 1, 6)' 。 我怎樣才能做到這一點？ 我嘗試了這些：1）在使cy變量時在邊緣選擇器中使用mapData（）（不適用於添加的邊緣和節點）

2）在制作完每個邊緣后，對每個邊緣使用mapData（）： cy.$('#edge' + i).style('width','mapData(weight, 0, 100, 1, 6)');

3）在制作完所有節點和邊后使用mapData（）： cy.elements('edge').style('line-color','mapData(weight,1,6,blue,green)');

它們都不起作用！

Answer 1

也許是這樣的：

var cy = window.cy = cytoscape({
    container: document.getElementById('cy'),
    style: [
      {
        selector: 'node',
        style: {
          'label': 'data(name)',
          'width': 'mapData(weight, 0, 100, 1, 6)',
          'height': 'mapData(weight, 0, 100, 1, 6)',
        }
      }
    ]
  });

cy.add([
  { group: "nodes", data: { id: "n0", name: "node0", weight: "x"} },
  { group: "nodes", data: { id: "n1", name: "node1", weight: "y"} },
  { group: "edges", data: { id: "e0", source: "n0", target: "n1" } }
]);

cy.ready(function ()  {            // Wait for nodes to be added
    cy.layout(                     // Call layout
        name: 'yourDecision'
    ).run();
});

我在初始化時定義cytoscape實例，並在其中定義node / edges / ...的樣式。