Skip to content

Cytoscape

It displays graphs using inputs from another blocks using Cytoscape.js.

Output

Selected node or edge as JSON.

Input

The input corresponds to the elements objects from Cytoscape.js - Elements JSON. Next we provide the nodes and edges groups that are automatically inferred:

[
    { "data": { "id": "a", "label": "A" } },
    { "data": { "id": "b", "label": "B" } },
    { "data": { "id": "c", "label": "C" } },
    { "data": { "id": "d", "label": "D" } },
    { "data": { "id": "e", "label": "E" } },
    { "data": { "id": "f" } },
    { "data": { "id": "ab", "source": "a", "target": "b" } },
    { "data": { "id": "cd", "source": "c", "target": "d" } },
    { "data": { "id": "ef", "source": "e", "target": "f" } },
    { "data": { "id": "ac", "source": "a", "target": "c" } },
    { "data": { "id": "be", "source": "b", "target": "e" } }]

Parameters

Layout

The layout used to display the graph. The default layout is dagre.

Events

Extended configuration

Provide custom style

Replace style from Cytoscape.js - Elements JSON. Example:

[
    {
        "selector": "node",
        "style": {
            "label": "data(id)"
        }
    }
]

Provide additional layout config

Replace layout from Cytoscape.js - Elements JSON. Example:

{ "name": "cose" }

Examples

Cytoscape Block on inseri.swiss.

Posts on inseri.swiss that make use of the Plotly chart block.