1

如何在 Jsnetworkx 中显示边缘属性?

我希望能够更改边缘颜色和箭头样式的结尾(一些边缘是箭头和一些 T。(类似于:http: //upload.wikimedia.org/wikipedia/commons/d/dc/ DG_Network_in_Hybrid_Rice.png )

我正在尝试调整其中一个示例:

http://jsfiddle.net/3J3k4/

var G = jsnx.DiGraph();

G.add_nodes_from([1,2,3,4,5,[9,{color: '#008A00'}]], {color: '#0064C7'});
G.add_cycle([1,2,3,4,5]);
G.add_edges_from([[1,9,{color: '#008A00'}], [9,1]]);

jsnx.draw(G, {
    element: '#canvas', 
    with_labels: true, 
    node_style: {
        fill: function(d) { 
            return d.data.color; 
        }
    }, 
   label_style: {fill: 'white' },
   edge_style: {
       fill: 'red'
   }
});
4

1 回答 1

3

@user27815,要添加 edge_style 属性,我使用了一个函数。代码片段如下

var G = jsnx.DiGraph(); 
G.add_nodes_from([1,2,3,4,5,[9,{color: '#008A00'}]], {color: '#0064C7'});
G.add_cycle([1,2,3,4,5]);
G.add_edges_from([[1,9,{color: '#008A00'}], [9,1]]); 
jsnx.draw(G, {
  element: '#canvas', 
  with_labels: true, 
  node_style: {
    fill: function(d) { 
        return d.data.color; 
    }
  }, 
  label_style: {fill: 'white' },
  edge_style: { 
    'stroke': function(d) {
            return d.data.color|| '#AAA';
          }, 
    'stroke-width': 2
  }
});

你可以参考这个JSFIDDLE

于 2014-12-20T14:45:07.520 回答