Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Soccer Play-by-Play

Public visualization

Viewing a saved revision (read-only)

e6b2a7e7b9e34d0995f9ff56076579df

Soccer Play-by-Play

0 stars0🌍 Public
Nnatecoursey-mck
Last edited Jun 10, 2022
Created on May 25, 2022
Forked from HTML Starter

This visualization animates soccer play-by-play data from a match between Belgium and Brazil, showing passes and dribbles as moving circles and trailing lines on a pitch. Each action is color-coded by team, with the current action labeled above the field and results like failures or offsides distinguished by color. The animation advances through time using d3.interval, updating the circle position every 800 milliseconds and drawing lines for the five most recent actions. It uses the d3-soccer pitch layout, d3.scaleLinear for coordinates, and d3.transition for smooth movement.

AI-generated description
ISC Licensed