3D scatter charts render each data point as an instanced sphere using WebGL 2. Supports size mapping (sizeKey), color mapping (colorKey), custom palettes, and configurable sphere segment detail. Built on the Series3DBase instanced rendering pipeline for efficient batch drawing. Pro license required.

Subtype

▾

Live Preview

x	y
10	10
84	25
15	12
55	32
40	27
46	14
60	88
23	20
36	37
53	84

{
  "data": [
    {
      "x": 10,
      "y": 10
    },
    {
      "x": 84,
      "y": 25
    },
    {
      "x": 15,
      "y": 12
    },
    {
      "x": 55,
      "y": 32
    },
    {
      "x": 40,
      "y": 27
    },
    {
      "x": 46,
      "y": 14
    },
    {
      "x": 60,
      "y": 88
    },
    {
      "x": 23,
      "y": 20
    },
    {
      "x": 36,
      "y": 37
    },
    {
      "x": 53,
      "y": 84
    },
    {
      "x": 88,
      "y": 68
    },
    {
      "x": 76,
      "y": 73
    },
    {
      "x": 24,
      "y": 48
    },
    {
      "x": 90,
      "y": 32
    },
    {
      "x": 75,
      "y": 50
    },
    {
      "x": 45,
      "y": 59
    },
    {
      "x": 84,
      "y": 88
    },
    {
      "x": 45,
      "y": 65
    },
    {
      "x": 62,
      "y": 72
    },
    {
      "x": 36,
      "y": 80
    },
    {
      "x": 71,
      "y": 29
    },
    {
      "x": 54,
      "y": 67
    },
    {
      "x": 63,
      "y": 35
    },
    {
      "x": 44,
      "y": 47
    },
    {
      "x": 21,
      "y": 44
    },
    {
      "x": 36,
      "y": 34
    },
    {
      "x": 50,
      "y": 38
    },
    {
      "x": 10,
      "y": 85
    },
    {
      "x": 23,
      "y": 63
    },
    {
      "x": 44,
      "y": 88
    }
  ],
  "series": [
    {
      "type": "scatter3d",
      "xKey": "x",
      "yKey": "y",
      "fill": "#6366f1"
    }
  ],
  "title": {
    "text": "Basic 3D Scatter"
  }
}

Edit JSON above · auto-previews after 0.9 s

Data points rendered as instanced 3D spheres with uniform size and color.

Was this article helpful?