我正在尝试使用Cystoscape(http://cytoscape.github.io/cytoscape.js/)来创建星形布局。我能够获得所有节点并相应地关联它们。我无法做的是使中心节点出现在中心,而其他节点以星座方式出现。
$('#cy').cytoscape({
elements: [
{ // node n1
group: 'nodes', // 'nodes' for a node, 'edges' for an edge
data: { // element data (put dev data here)
id: 'n1', // mandatory for each element, assigned automatically on undefined
parent: 'nparent', // indicates the compound node parent id; not defined => no parent
},
position: { // the model position of the node (optional on init, mandatory after)
x: 100,
y: 100
},
selected: false, // whether the element is selected (default false)
selectable: true, // whether the selection state is mutable (default true)
locked: false, // when locked a node's position is immutable (default false)
grabbable: true, // whether the node can be grabbed and moved by the user
classes: 'foo bar' // a space separated list of class names that the element has
},
{ // node n2
group: 'nodes',
data: { id: 'n2' },
renderedPosition: { x: 200, y: 200 } // can alternatively specify position in rendered on-screen pixels
},
{ // node n3
group: 'nodes',
data: { id: 'n3', parent: 'nparent' },
position: { x: 123, y: 234 }
},
{ // node nparent
group: 'nodes',
data: { id: 'nparent' }
},
{ // edge e1
group: 'edges',
data: {
id: 'e1',
source: 'n1', // the source node id (edge comes from this node)
target: 'n2' // the target node id (edge goes to this node)
}
}
],
// so we can see the ids
style: cytoscape.stylesheet().
selector('node')
.css({
'content': 'data(id)'
})
});
我面临的其他问题是添加新节点的能力。作为这个图书馆的新手,我将不胜感激。
答案 0 :(得分:0)
查看链接http://cytoscape.github.io/cytoscape.js/#style/properties 并改变节点属性" shape"到"明星"如下。它会自动将拓扑更改为星形。然后,您不需要指定每个节点的位置x,y。它会自动出现在中心
形状:星