Phase 3: data-story viz — StatsBomb shot map, xG race, pass networks
- buildStatsbombViz.ts: processes the 2022 WC Final (Argentina 3-3 France) from StatsBomb open data → shots+xG, cumulative xG race, starting-XI pass networks, totals, shootout result. Output committed (11KB) to avoid build-time fetch - Custom SVG viz (no chart lib): reusable Pitch (StatsBomb 120x80 coords), ShotMap (xG-sized dots, teams attacking opposite goals), XgRace (stepped cumulative xG with goal markers, d3-scale), PassNetwork (nodes ∝ involvement, links ∝ pass volume) - StoryPage: narrative with hero scoreline, by-the-numbers bars, and the three visualizations with explanatory copy - Verified in browser: all three render correctly, no console errors Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
+4
-1
@@ -8,7 +8,10 @@ server/node_modules
|
||||
.env
|
||||
.env.local
|
||||
# Generated build artifacts (reproduced by `npm run data:build`)
|
||||
public/data
|
||||
public/data/fixtures.json
|
||||
public/data/ratings.json
|
||||
public/pwa-192x192.png
|
||||
public/pwa-512x512.png
|
||||
public/favicon.svg
|
||||
# Note: public/data/viz/*.json IS committed — it's processed from a fixed
|
||||
# historical StatsBomb match, so we don't refetch 3.7MB of events at build time.
|
||||
|
||||
Reference in New Issue
Block a user