import { useSQLQuery } from "@motherduck/react-sql-query"; import { LineChart, Line, BarChart, Bar, AreaChart, Area, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, ReferenceLine, ReferenceArea, Cell } from "recharts"; export const REQUIRED_DATABASES = [ { type: 'share', path: 'md:_share/nba_box_scores_v2/a7b37364-0c16-4422-8bf1-1f36ec62efb0', alias: 'nba_box_scores_v2' } ]; function N(v) { return v != null ? Number(v) : 0; } // Chapter metadata — the editorial spine of the page var CHAPTERS = [ { years: [2015, 2016], label: "I. The Sleeper", kicker: "Picked 41st. Asleep on the couch when it happened.", body: "Drafted in 2014 during a Taco Bell commercial — second round, 41st overall. A 6'11 Serbian center nobody noticed. The rookie year averages whisper rather than shout: 10 points, six rebounds, zero triple-doubles. Forgettable. Almost." }, { years: [2017, 2019], label: "II. The Riser", kicker: "Three years of unmistakable signal.", body: "Something happens between 2017 and 2019. The triple-doubles start arriving — six, then ten, then twelve. The points climb steadily. The Nuggets miss the playoffs by a single game in 2018. Then, in 2019, Jokić leads them back. The league starts paying attention." }, { years: [2020, 2022], label: "III. The MVP. Three Times.", kicker: "Back-to-back-to-back: 2021, 2022, 2023 MVPs.", body: "Only Wilt, Russell, Kareem, Bird, Magic, and LeBron had ever won three MVPs. In 2020-21 his True Shooting hits 66%. In 2021-22, it hits an absurd 70% — the highest mark in NBA history for a player with this volume. Twenty-nine triple-doubles in a single season. The center who couldn't jump was bending the math." }, { years: [2023, 2023], label: "IV. The Champion", kicker: "Denver's first title. He was the only conclusion.", body: "Twelve playoff games. Two triple-doubles. A 63% True Shooting through the postseason. Finals MVP. The Larry O'Brien Trophy travels to Denver for the first time in franchise history. The argument was over." }, { years: [2024, 2025], label: "V. The Standard", kicker: "A 6'11 center averaging ten assists a night. Routine, somehow.", body: "Then he gets better. In 2023-24: 29.6 points, 12.7 rebounds, a career-high 10.2 assists per game. A 61-point game. In 2024-25: he sustains it. This isn't a peak anymore. It's a plateau, and the plateau is the highest any center has ever stood." } ]; function chapterFor(year) { for (var i = 0; i < CHAPTERS.length; i++) { if (year >= CHAPTERS[i].years[0] && year <= CHAPTERS[i].years[1]) return CHAPTERS[i]; } return null; } // Visual palette — restrained, editorial. Nuggets navy and gold, ivory paper. var INK = "#0d1530"; // deep navy ink var INK_SOFT = "#3a4566"; // body text var INK_MUTED = "#8590a8"; // captions var PAPER = "#f4efe6"; // warm ivory var PAPER_DEEP = "#ebe3d4"; // panel var GOLD = "#c9a24a"; // accent — Nuggets-inspired but muted var GOLD_DEEP = "#8a6a1f"; var RULE = "#d6cdb9"; // hairline rule on paper var CHAPTER_TINT = { "I. The Sleeper": "#b9b0a0", "II. The Riser": "#8a99b8", "III. The MVP. Three Times.": "#c9a24a", "IV. The Champion": "#0d1530", "V. The Standard": "#8a6a1f" }; // CSS injected once — fonts and per-page atmosphere var STYLES = ` @import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500;9..144,700;9..144,900&family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap'); .jokic-page { background: ${PAPER}; color: ${INK}; font-family: 'Inter', -apple-system, sans-serif; min-height: 100vh; } .jokic-page .display { font-family: 'Fraunces', 'Times New Roman', serif; font-optical-sizing: auto; } .jokic-page .mono { font-family: 'JetBrains Mono', monospace; font-feature-settings: 'tnum' 1; } .jokic-page .rule { height: 1px; background: ${RULE}; width: 100%; } .jokic-page .thick-rule { height: 2px; background: ${INK}; width: 100%; } .jokic-page .drop-cap::first-letter { font-family: 'Fraunces', serif; font-weight: 700; font-size: 3.6em; line-height: 0.85; float: left; margin: 0.05em 0.12em 0 0; color: ${INK}; } @keyframes jokic-fade-up { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } } .jokic-page .reveal { animation: jokic-fade-up 0.8s ease-out both; } `; // Custom Recharts tooltip that matches the editorial style function EditorialTooltip(props) { if (!props.active || !props.payload || !props.payload.length) return null; var p = props.payload[0].payload; return (

SEASON {p.season}–{String(Number(p.season) + 1).slice(2)}

{props.payload.map(function(entry, i) { return (

{entry.name} {typeof entry.value === "number" ? entry.value.toFixed(1) : entry.value}{entry.dataKey === "ts_pct" || entry.dataKey === "fg_pct" ? "%" : ""}

); })}

); } // Chapter band as a horizontal divider strip function ChapterBand(props) { return (

{props.kicker}

); } export default function JokicCareerArc() { // Per-season regular season stats — the spine. minutes is MM:SS varchar; parse with split_part. var seasonStats = useSQLQuery("WITH m AS (SELECT bs.*, CAST(split_part(bs.minutes,':',1) AS DOUBLE) + CAST(split_part(bs.minutes,':',2) AS DOUBLE)/60.0 AS min_dec FROM \"nba_box_scores_v2\".\"main\".\"box_scores\" bs WHERE bs.entity_id = '203999' AND bs.period = 'FullGame') SELECT s.season_year::INTEGER as season, ROUND(AVG(m.points), 1) as pts, ROUND(AVG(m.rebounds), 1) as reb, ROUND(AVG(m.assists), 1) as ast, ROUND(AVG(m.min_dec), 1) as mpg, ROUND(SUM(m.points) * 36.0 / NULLIF(SUM(m.min_dec), 0), 1) as pts_per_36, ROUND(SUM(m.fg_made) * 100.0 / NULLIF(SUM(m.fg_attempted), 0), 1) as fg_pct, ROUND(SUM(m.points) * 100.0 / NULLIF(2 * (SUM(m.fg_attempted) + 0.44 * SUM(m.ft_attempted)), 0), 1) as ts_pct, COUNT(*) FILTER (WHERE m.points >= 10 AND m.rebounds >= 10 AND m.assists >= 10) as triple_doubles, ROUND(AVG(gq.game_quality), 3) as avg_gq, MAX(m.points) as season_high FROM m JOIN \"nba_box_scores_v2\".\"main\".\"schedule\" s ON m.game_id = s.game_id LEFT JOIN \"nba_box_scores_v2\".\"main\".\"game_quality\" gq ON m.game_id = gq.game_id AND m.entity_id = gq.entity_id WHERE s.season_type = 'Regular Season' GROUP BY 1 ORDER BY 1"); // Playoff stats — same MM:SS parse, per-36 included var playoffStats = useSQLQuery("WITH m AS (SELECT bs.*, CAST(split_part(bs.minutes,':',1) AS DOUBLE) + CAST(split_part(bs.minutes,':',2) AS DOUBLE)/60.0 AS min_dec FROM \"nba_box_scores_v2\".\"main\".\"box_scores\" bs WHERE bs.entity_id = '203999' AND bs.period = 'FullGame') SELECT s.season_year::INTEGER as season, COUNT(*) as games, ROUND(AVG(m.points), 1) as pts, ROUND(SUM(m.points) * 36.0 / NULLIF(SUM(m.min_dec), 0), 1) as pts_per_36, ROUND(AVG(m.min_dec), 1) as mpg, ROUND(AVG(m.assists), 1) as ast, ROUND(AVG(m.rebounds), 1) as reb, ROUND(SUM(m.points) * 100.0 / NULLIF(2 * (SUM(m.fg_attempted) + 0.44 * SUM(m.ft_attempted)), 0), 1) as ts_pct FROM m JOIN \"nba_box_scores_v2\".\"main\".\"schedule\" s ON m.game_id = s.game_id WHERE s.season_type = 'Playoffs' GROUP BY 1 ORDER BY 1"); // Career totals for the hero var totals = useSQLQuery("SELECT COUNT(DISTINCT bs.game_id) as games, MAX(bs.points) as max_pts, COUNT(*) FILTER (WHERE bs.points >= 10 AND bs.rebounds >= 10 AND bs.assists >= 10) as tds, ROUND(SUM(bs.points) * 100.0 / NULLIF(2 * (SUM(bs.fg_attempted) + 0.44 * SUM(bs.ft_attempted)), 0), 1) as career_ts FROM \"nba_box_scores_v2\".\"main\".\"box_scores\" bs JOIN \"nba_box_scores_v2\".\"main\".\"schedule\" s ON bs.game_id = s.game_id WHERE bs.entity_id = '203999' AND bs.period = 'FullGame'"); // 50+ point games for the climax callout var bigGames = useSQLQuery("SELECT s.game_date::DATE::VARCHAR as date, bs.points as pts, bs.rebounds as reb, bs.assists as ast, s.home_team_abbreviation as home, s.away_team_abbreviation as away, s.season_year FROM \"nba_box_scores_v2\".\"main\".\"box_scores\" bs JOIN \"nba_box_scores_v2\".\"main\".\"schedule\" s ON bs.game_id = s.game_id WHERE bs.entity_id = '203999' AND bs.period = 'FullGame' AND bs.points >= 50 ORDER BY bs.points DESC"); var stats = Array.isArray(seasonStats.data) ? seasonStats.data : []; var po = Array.isArray(playoffStats.data) ? playoffStats.data : []; var t = Array.isArray(totals.data) && totals.data[0] ? totals.data[0] : {}; var big = Array.isArray(bigGames.data) ? bigGames.data : []; // Enrich each season row with chapter for stripe coloring and merged playoff pts for coda chart var poMap = {}; po.forEach(function(r) { poMap[r.season] = Number(r.pts); }); var statsEnriched = stats.map(function(r) { var ch = chapterFor(Number(r.season)); return Object.assign({}, r, { pts: Number(r.pts), reb: Number(r.reb), ast: Number(r.ast), ts_pct: Number(r.ts_pct), triple_doubles: Number(r.triple_doubles), avg_gq: Number(r.avg_gq), chapter: ch ? ch.label : "", tint: ch ? CHAPTER_TINT[ch.label] : INK_MUTED, pts_playoffs: poMap[r.season] != null ? poMap[r.season] : null }); }); // Find peak GQ correctly — the bug in v4 used the LAST row, not the max var peakGQ = stats.reduce(function(m, r) { return N(r.avg_gq) > m ? N(r.avg_gq) : m; }, 0); var peakGQSeason = stats.reduce(function(acc, r) { return N(r.avg_gq) > acc.v ? { v: N(r.avg_gq), s: r.season } : acc; }, { v: -1, s: null }); var anyLoading = seasonStats.isLoading || playoffStats.isLoading || totals.isLoading; return (

{/* ============== MASTHEAD ============== */}

An NBA Career Arc · Eleven Seasons

Box Score Reading · Vol. III

The Forty-First Pick

Nikola
Jokić

How a Serbian center who was undrafted in the first round became the player the rest of the league has to plan around.

The arc reads like fiction. Eleven seasons. Three Most Valuable Player awards. One championship. A career True Shooting percentage that rewrites what was thought possible at his volume. The numbers on this page are not interpretation. They are record.

Filed from MotherDuck · Data through 2025–26

{/* ============== HERO STATLINE ============== */}

{[ { v: anyLoading ? "—" : N(t.games).toLocaleString(), l: "Regular-Season Games" }, { v: anyLoading ? "—" : N(t.tds).toLocaleString(), l: "Triple-Doubles" }, { v: anyLoading ? "—" : N(t.max_pts).toString(), l: "Single-Game High" }, { v: anyLoading ? "—" : N(t.career_ts).toFixed(1) + "%", l: "Career True Shooting" }, { v: anyLoading ? "—" : (peakGQ * 100).toFixed(1) + "%", l: "Peak Game Quality" } ].map(function(k, i) { return (

{k.v}

{k.l}

); })}

{/* ============== CHAPTER I — THE SLEEPER ============== */}

The Sleeper

{CHAPTERS[0].kicker}

{CHAPTERS[0].body}

The Rookie Line, 2015–16

{anyLoading ?

: (

{[ { l: "Points per game", v: stats[0] ? N(stats[0].pts).toFixed(1) : "—" }, { l: "Rebounds per game", v: stats[0] ? N(stats[0].reb).toFixed(1) : "—" }, { l: "Assists per game", v: stats[0] ? N(stats[0].ast).toFixed(1) : "—" }, { l: "Triple-doubles", v: stats[0] ? N(stats[0].triple_doubles).toString() : "—" }, { l: "Game Quality", v: stats[0] ? (N(stats[0].avg_gq) * 100).toFixed(1) + "%" : "—" } ].map(function(row, i) { return (

{row.l} {row.v}

); })}

)}

{/* ============== CHAPTER II — THE RISER ============== */}

Triple-Doubles Per Season

The first signal anyone had no choice but to read.

{anyLoading ?

: ( } cursor={{fill: "rgba(13,21,48,0.05)"}} /> {statsEnriched.map(function(d, i) { return ; })} )}

The Riser

{CHAPTERS[1].kicker}

{CHAPTERS[1].body}

{/* ============== CHAPTER III — THE MVP ============== */}

The MVP. Three Times.

{CHAPTERS[2].kicker}

{CHAPTERS[2].body}

True Shooting %, Career

Volume and efficiency — at once.

{anyLoading ?

: ( } cursor={{stroke: INK, strokeWidth: 1, strokeDasharray: "2 4"}} /> )}

{/* ============== THE BIG CHART — THE WHOLE ARC ============== */}

Points and Assists Per Game

One scoring chart. One playmaking chart. Same shape.

Points

Assists

{anyLoading ?

: ( } cursor={{stroke: INK, strokeWidth: 1, strokeDasharray: "2 4"}} /> )}

Gold band = MVP seasons (2020–2022). Dashed line = championship season (2022–23).

{/* ============== CHAPTER IV — THE CHAMPION ============== */}

{CHAPTERS[3].kicker}

The Champion.

{CHAPTERS[3].body}

{po.filter(function(r){ return Number(r.season) === 2022; }).map(function(r, i) { return (

The 2023 Playoff Run

{[ { l: "Points/G", v: N(r.pts).toFixed(1) }, { l: "Rebounds/G", v: N(r.reb).toFixed(1) }, { l: "Assists/G", v: N(r.ast).toFixed(1) }, { l: "True Shooting", v: N(r.ts_pct).toFixed(1) + "%" } ].map(function(k, j) { return (

{k.v}

{k.l}

); })}

{/* ============== CHAPTER V — THE STANDARD ============== */}

The Standard

{CHAPTERS[4].kicker}

{CHAPTERS[4].body}

{peakGQSeason.s != null && (

Peak Game Quality

{(peakGQ * 100).toFixed(1) + "%"} in {peakGQSeason.s}–{String(Number(peakGQSeason.s)+1).slice(2)}

i.e. he won {(peakGQ * 100).toFixed(1)}% of his weekly head-to-head matchups against every other rotation player in the league.

)}

50+ Point Games

The kind of game centers don't have.

{anyLoading ?

: big.length === 0 ? (

No 50-point games on record.

) : (

{big.map(function(g, i) { return (

{N(g.pts)}

{g.away} at {g.home}

{g.date} · {N(g.reb)} reb · {N(g.ast)} ast

{g.season_year}–{String(g.season_year+1).slice(2)}

); })}

)}

{/* ============== CODA — REGULAR SEASON vs PLAYOFFS ============== */}

Regular Season vs. Playoffs

Points Per Game

Most stars dim in the playoffs. He doesn't.

{anyLoading ?

: ( } cursor={{stroke: INK, strokeWidth: 1, strokeDasharray: "2 4"}} /> )}

Regular Season

Playoffs

{/* ============== COLOPHON ============== */}

Source · nba_box_scores_v2 · entity_id 203999

Box Score Reading is a series.

); }

Nikola Jokić

The Sleeper

The Riser

The MVP. Three Times.

The Champion.

The Standard

Nikola
Jokić

Nikola Jokić Career Arc

Comments