Force-directed network graph simulation in 3D space. Nodes are rendered as cubes with group-based coloring, and edges as thin box links. Uses N-body repulsion and spring attraction with configurable iteration count, repulsion strength, and damping. Layout is normalized to fit within the scene bounds.

Subtype

▾

Live Preview

{
  "data": [
    {
      "id": "A",
      "group": 0
    },
    {
      "id": "B",
      "group": 0
    },
    {
      "id": "C",
      "group": 1
    },
    {
      "id": "D",
      "group": 1
    },
    {
      "id": "E",
      "group": 2
    },
    {
      "id": "F",
      "group": 2
    }
  ],
  "series": [
    {
      "type": "forceGraph3d",
      "nodes": [
        {
          "id": "A",
          "group": 0
        },
        {
          "id": "B",
          "group": 0
        },
        {
          "id": "C",
          "group": 1
        },
        {
          "id": "D",
          "group": 1
        },
        {
          "id": "E",
          "group": 2
        },
        {
          "id": "F",
          "group": 2
        }
      ],
      "edges": [
        {
          "source": "A",
          "target": "B"
        },
        {
          "source": "A",
          "target": "C"
        },
        {
          "source": "B",
          "target": "D"
        },
        {
          "source": "C",
          "target": "E"
        },
        {
          "source": "D",
          "target": "F"
        },
        {
          "source": "E",
          "target": "F"
        }
      ],
      "nodeIdKey": "id",
      "sourceKey": "source",
      "targetKey": "target",
      "groupKey": "group"
    }
  ],
  "title": {
    "text": "3D Force Graph — Network"
  }
}

Edit JSON above · auto-previews after 0.9 s

Force-directed graph with grouped node coloring.

Was this article helpful?

source	target

source	target