Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Fork of Fork of React & D3 Starter

Public visualization

Viewing a saved revision (read-only)

a6ecb5f6e9f949d1aace2561fbeb568c

Fork of Fork of React & D3 Starter

0 stars0🌍 Public
Kkilian.hocke@axelspringer.com
Last edited Apr 16, 2026
Created on Apr 16, 2026

An interactive timeline visualizes key match events from the Champions League quarter-final second leg between Bayern Munich and Real Madrid, showing goals, halftime, and the final result. The Vue application renders event cards on a central time axis, using custom JavaScript classes to handle event rendering and player image display. It draws on local PNG resources for team logos and player photos, respectively. The implementation leverages core DOM APIs for dynamic element creation, CSS Grid for layout, and audio playback for goal sounds.

AI-generated description