如何基于Cytoscape Cola中的重量分组节点

Question

我使用带有可乐的Cytoscape遇到困难。
我想要一个网络，其中有"重"边缘连接它们的节点倾向于彼此靠近。
到目前为止，我的JavaScript代码看起来像这样：

    var elems = [
    {data: {id: '1', name: 'Node 1', nodecolor: '#88cc88'}},
    {data: {id: '2', name: 'Node 2', nodecolor: '#888888'}},
    {data: {id: '3', name: 'Node 3', nodecolor: '#888888'}},
    {data: {id: '4', name: 'Node 4', nodecolor: '#888888'}},
    {data: {id: '5', name: 'Node 5', nodecolor: '#888888'}},
    {data: {id: 'e1', source: '1', target: '5', linkcolor: '#888888', "weight":50 } },
    {data: {id: 'e2', source: '3', target: '4', linkcolor: '#888888', "weight":30} },
    {data: {id: 'e3', source: '2', target: '1', linkcolor: '#888888', "weight":20} },
    {data: {id: 'e4', source: '1', target: '4', linkcolor: '#888888', "weight":100} },
    {data: {id: 'e5', source: '5', target: '2', linkcolor: '#888888', "weight":100} },
    {data: {id: 'e6', source: '1', target: '2', linkcolor: '#888888', "weight":40} }
];
var cy = cytoscape({
    container: document.getElementById('cy'),
    elements: elems,
    style: cytoscape.stylesheet()
            .selector('node').style({
                'background-color': 'data(nodecolor)',
                label: 'data(name)',
                width: 25,
                height: 25
            })
            .selector('edge').style({
                'line-color': 'data(linkcolor)',
                width: 3
            })
});
cy.layout({name: 'cola',
           infinite: true,
           fit: false,
           padding: 10,
           edgeLength: function( edge ){var len = edge.data('weight'); return 10/len; }});

如您所见，我试图更改Edgelength参数，以成比例地与边缘的"重量"属性相反，但似乎并没有任何区别。

Answer 1

您必须使用返回边缘明智长度的公式。对于所有边缘，您的公式返回的长度少于一个像素。这是一个不可能的限制，尤其是考虑到可乐支持avoidOverlap和nodeSpacing。

等选项。

更合适的公式将是诸如edge => k / edge.data('weight')之类的，其中k是10000的数量级 - 您选择了k = 10。k = 10000的长度为100和E3的长度为500。

为了有效地使用布局，请务必仔细查看所有布局选项，并确保将它们设置为适当的结果。