Question

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

我希望能够改变边缘颜色和箭头样式的结束（一些边缘是箭头和一些T＆＃39; s。（类似于：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'
   }
});

Answer 1

@ 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。

Answer 2

使用jsnx.draw(G, {方法中的以下代码：

edgeStyle: {
   'stroke-width': 15,
   fill: '#999'
},

如何更改jsnetworkx边缘颜色

2 个答案: