Question

我正在使用cytoscope.js绘制状态转换图。我从API检索节点和边缘，因此节点和边的数量不固定。

对于测试，如果我提到所有节点的位置，则图表会正确呈现：

var cy = window.cy = cytoscape({
    container: document.getElementById('cy'),
    boxSelectionEnabled: false,
    autounselectify: true,

    layout: {
        name: 'preset'
    },
    elements: [{
        "data": {
            "id": "n61",
        },
        "position": {
            "x": 350,
            "y": 315
        },
    }, {
        "data": {
            "id": "n62",
        },
        "position": {
            "x": 450,
            "y": 315
        },
    }, {
        "data": {
            "id": "n63",
        },
        "position": {
            "x": 550,
            "y": 315
        }
    }, {
        "data": {
            "id": "n64",
        },
        "position": {
            "x": 50,
            "y": 405
        }
    }, {
        "data": {
            "source": "n63",
            "target": "n61"
        }
    }, {
        "data": {
            "source": "n61",
            "target": "n62"
        }
    }, {
        "data": {
            "source": "n61",
            "target": "n64"
        }
    }, {
        "data": {
            "source": "n64",
            "target": "n62"
        }
    }]
});

但是如果有变量节点，我如何确定/计算每个节点的位置，以便它们在我的视口中渲染？

Answer 1

每个边都必须有明确定义的源节点和目标节点。如果源或目标不存在，则边缘不存在。

要自动定位节点，请使用布局：http://js.cytoscape.org/#layouts

Cytoscope计算节点位置

1 个答案: