gridTables: small multiples on one page (gt_grid)

AFC by division

2024 regular season

AFC West

Wins	Losses	PF
15	2	385
11	6	402
10	7	425
4	13	309

AFC East

Wins	Losses	PF
13	4	525
8	9	345
5	12	338
4	13	289

import { STANDINGS, type Standing } from "@sportsdataverse/examples/data";
import { defineTable } from "@sportsdataverse/sdvtables";
import { gridTables } from "@sportsdataverse/sdvtables/export";
import { prepare } from "@sportsdataverse/sdvtables/html";

const spec = defineTable<Standing>()
  .columns((c) => [
    c.logo("team", { league: "nfl" }),
    c.int("wins"),
    c.int("losses"),
    c.int("pf", { label: "PF" }),
  ])
  .theme("athletic")
  .build();
await prepare(spec);
// HTML, no browser needed; htmlToPNG(page) is the PNG (Chromium, see the export guide)
gridTables(
  [
    { spec, rows: STANDINGS.filter((r) => r.division === "West") },
    { spec, rows: STANDINGS.filter((r) => r.division === "East") },
  ],
  { ncol: 2, labels: ["AFC West", "AFC East"], title: "AFC by division", subtitle: "2024 regular season" },
);

Tags: node · table · export · gridTables · nfl. All sdvtables examples.