Skip to content
Vega-Lite templates

Packaging Defect Pareto (Vega-Lite)

Defect counts as bars with a cumulative percentage line, where the top three codes account for 79 percent of 380 defects.

Template previewVega-Lite
Rendering…

Make it your own.

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "title": "Packaging defects - line 3, quarter to date (n = 380)",
  "data": {
    "values": [
      {"code": "Seal leak", "count": 142, "cumulative": 37.4},
      {"code": "Label misprint", "count": 96, "cumulative": 62.6},
      {"code": "Fill weight low", "count": 61, "cumulative": 78.7},
      {"code": "Cap cross-thread", "count": 38, "cumulative": 88.7},
      {"code": "Foreign body", "count": 19, "cumulative": 93.7},
      {"code": "Carton crush", "count": 14, "cumulative": 97.4},
      {"code": "Other", "count": 10, "cumulative": 100.0}
    ]
  },
  "encoding": {
    "x": {"field": "code", "type": "nominal", "sort": null, "title": null, "axis": {"labelAngle": -30}}
  },
  "layer": [
    {
      "mark": {"type": "bar", "color": "#38bdf8"},
      "encoding": {"y": {"field": "count", "type": "quantitative", "title": "Defects"}}
    },
    {
      "mark": {"type": "line", "point": true, "color": "#ef4444"},
      "encoding": {
        "y": {"field": "cumulative", "type": "quantitative", "title": "Cumulative percent",
              "scale": {"domain": [0, 100]}}
      }
    }
  ],
  "resolve": {"scale": {"y": "independent"}}
}