1

我正在尝试使用 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)'
             })

        });

我面临的另一个问题是添加新节点的能力。作为这个图书馆的新手,我将不胜感激。

4

1 回答 1

0

查看链接http://cytoscape.github.io/cytoscape.js/#style/properties 并将节点属性“shape”更改为“star”,如下所示。它会自动将您的拓扑更改为星形。那么您将不需要指定每个节点的位置 x,y。它会自动出现在中心

形状:星形

于 2014-05-26T13:22:37.030 回答