Skip to content

Instantly share code, notes, and snippets.

@statico

statico/index.html

Last active January 3, 2026 19:58
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save statico/9f16d7156b822f50f43d7f4f3a7d5074 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save statico/9f16d7156b822f50f43d7f4f3a7d5074 to your computer and use it in GitHub Desktop.
Download ZIP
Complete MCU Ratings: Movies & TV Shows - 75 titles • 2008-2025 • Ordered by Release Date
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MCU Ratings</title>
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script>
<style>
body { margin: 20px; font-family: system-ui, sans-serif; background: #030712; color: #fff; }
h1 { text-align: center; margin-bottom: 20px; }
#chart { max-width: 1200px; margin: 0 auto; }
</style>
</head>
<body>
<h1>MCU Ratings</h1>
<div id="chart"><canvas id="myChart"></canvas></div>
<script>
const data = [
{ title: "Iron Man", year: 2008, imdb: 7.9, metascore: 79, type: "movie", short: "Iron Man" },
{ title: "The Incredible Hulk", year: 2008, imdb: 6.6, metascore: 61, type: "movie", short: "Hulk" },
{ title: "Iron Man 2", year: 2010, imdb: 6.9, metascore: 57, type: "movie", short: "IM2" },
{ title: "Thor", year: 2011, imdb: 7.0, metascore: 57, type: "movie", short: "Thor" },
{ title: "Captain America: The First Avenger", year: 2011, imdb: 6.9, metascore: 66, type: "movie", short: "CA:TFA" },
{ title: "Marvel One-Shot: The Consultant", year: 2011, imdb: 6.3, metascore: null, type: "short", short: "Consultant" },
{ title: "Marvel One-Shot: A Funny Thing...", year: 2011, imdb: 7.1, metascore: null, type: "short", short: "Funny Thing" },
{ title: "The Avengers", year: 2012, imdb: 8.0, metascore: 69, type: "movie", short: "Avengers" },
{ title: "Marvel One-Shot: Item 47", year: 2012, imdb: 6.6, metascore: null, type: "short", short: "Item 47" },
{ title: "Iron Man 3", year: 2013, imdb: 7.1, metascore: 62, type: "movie", short: "IM3" },
{ title: "Agents of S.H.I.E.L.D.", year: 2013, imdb: 7.5, metascore: null, type: "tv", short: "AoS" },
{ title: "Marvel One-Shot: Agent Carter", year: 2013, imdb: 7.4, metascore: null, type: "short", short: "OS:Carter" },
{ title: "Thor: The Dark World", year: 2013, imdb: 6.7, metascore: 54, type: "movie", short: "Thor 2" },
{ title: "Marvel One-Shot: All Hail the King", year: 2014, imdb: 7.2, metascore: null, type: "short", short: "Hail King" },
{ title: "Captain America: The Winter Soldier", year: 2014, imdb: 7.7, metascore: 70, type: "movie", short: "CA:WS" },
{ title: "Guardians of the Galaxy", year: 2014, imdb: 8.0, metascore: 76, type: "movie", short: "GotG" },
{ title: "Agent Carter", year: 2015, imdb: 7.8, metascore: null, type: "tv", short: "Carter" },
{ title: "Daredevil", year: 2015, imdb: 8.6, metascore: null, type: "tv", short: "Daredevil" },
{ title: "Avengers: Age of Ultron", year: 2015, imdb: 7.3, metascore: 66, type: "movie", short: "AoU" },
{ title: "Ant-Man", year: 2015, imdb: 7.2, metascore: 64, type: "movie", short: "Ant-Man" },
{ title: "Jessica Jones", year: 2015, imdb: 7.8, metascore: null, type: "tv", short: "J Jones" },
{ title: "Captain America: Civil War", year: 2016, imdb: 7.8, metascore: 75, type: "movie", short: "CA:CW" },
{ title: "Luke Cage", year: 2016, imdb: 7.2, metascore: null, type: "tv", short: "Luke Cage" },
{ title: "Doctor Strange", year: 2016, imdb: 7.5, metascore: 72, type: "movie", short: "Dr Strange" },
{ title: "Iron Fist", year: 2017, imdb: 6.4, metascore: null, type: "tv", short: "Iron Fist" },
{ title: "Guardians of the Galaxy Vol. 2", year: 2017, imdb: 7.6, metascore: 67, type: "movie", short: "GotG 2" },
{ title: "Spider-Man: Homecoming", year: 2017, imdb: 7.4, metascore: 73, type: "movie", short: "SM:H" },
{ title: "The Defenders", year: 2017, imdb: 7.2, metascore: null, type: "tv", short: "Defenders" },
{ title: "Inhumans", year: 2017, imdb: 4.9, metascore: null, type: "tv", short: "Inhumans" },
{ title: "Runaways", year: 2017, imdb: 6.8, metascore: null, type: "tv", short: "Runaways" },
{ title: "Thor: Ragnarok", year: 2017, imdb: 7.9, metascore: 74, type: "movie", short: "Thor 3" },
{ title: "The Punisher", year: 2017, imdb: 8.4, metascore: null, type: "tv", short: "Punisher" },
{ title: "Black Panther", year: 2018, imdb: 7.3, metascore: 88, type: "movie", short: "BP" },
{ title: "Cloak & Dagger", year: 2018, imdb: 6.6, metascore: null, type: "tv", short: "C&D" },
{ title: "Avengers: Infinity War", year: 2018, imdb: 8.4, metascore: 68, type: "movie", short: "IW" },
{ title: "Ant-Man and the Wasp", year: 2018, imdb: 7.0, metascore: 70, type: "movie", short: "AM&W" },
{ title: "Captain Marvel", year: 2019, imdb: 6.7, metascore: 64, type: "movie", short: "CM" },
{ title: "Avengers: Endgame", year: 2019, imdb: 8.4, metascore: 78, type: "movie", short: "Endgame" },
{ title: "Spider-Man: Far from Home", year: 2019, imdb: 7.3, metascore: 69, type: "movie", short: "SM:FFH" },
{ title: "Helstrom", year: 2020, imdb: 6.7, metascore: null, type: "tv", short: "Helstrom" },
{ title: "WandaVision", year: 2021, imdb: 7.9, metascore: null, type: "tv", short: "WandaV" },
{ title: "The Falcon and the Winter Soldier", year: 2021, imdb: 7.1, metascore: null, type: "tv", short: "FATWS" },
{ title: "Loki", year: 2021, imdb: 8.2, metascore: null, type: "tv", short: "Loki" },
{ title: "Black Widow", year: 2021, imdb: 6.6, metascore: 68, type: "movie", short: "BW" },
{ title: "What If...?", year: 2021, imdb: 7.3, metascore: null, type: "tv", short: "What If" },
{ title: "Shang-Chi", year: 2021, imdb: 7.3, metascore: 71, type: "movie", short: "Shang-Chi" },
{ title: "Eternals", year: 2021, imdb: 6.2, metascore: 52, type: "movie", short: "Eternals" },
{ title: "Hawkeye", year: 2021, imdb: 7.4, metascore: null, type: "tv", short: "Hawkeye" },
{ title: "Spider-Man: No Way Home", year: 2021, imdb: 8.2, metascore: 71, type: "movie", short: "SM:NWH" },
{ title: "Moon Knight", year: 2022, imdb: 7.3, metascore: null, type: "tv", short: "Moon K" },
{ title: "Doctor Strange: MoM", year: 2022, imdb: 6.9, metascore: 60, type: "movie", short: "DS:MoM" },
{ title: "Ms. Marvel", year: 2022, imdb: 6.2, metascore: null, type: "tv", short: "Ms Marvel" },
{ title: "Thor: Love and Thunder", year: 2022, imdb: 6.1, metascore: 57, type: "movie", short: "Thor 4" },
{ title: "I Am Groot", year: 2022, imdb: 6.7, metascore: null, type: "tv", short: "Groot" },
{ title: "She-Hulk", year: 2022, imdb: 5.2, metascore: null, type: "tv", short: "She-Hulk" },
{ title: "Werewolf by Night", year: 2022, imdb: 7.1, metascore: null, type: "special", short: "Werewolf" },
{ title: "Black Panther: Wakanda Forever", year: 2022, imdb: 6.6, metascore: 67, type: "movie", short: "BP2" },
{ title: "GotG Holiday Special", year: 2022, imdb: 6.9, metascore: null, type: "special", short: "GotG Xmas" },
{ title: "Ant-Man: Quantumania", year: 2023, imdb: 6.0, metascore: 48, type: "movie", short: "AM3" },
{ title: "Guardians of the Galaxy Vol. 3", year: 2023, imdb: 7.9, metascore: 64, type: "movie", short: "GotG 3" },
{ title: "Secret Invasion", year: 2023, imdb: 5.8, metascore: null, type: "tv", short: "Secret Inv" },
{ title: "Loki S2", year: 2023, imdb: 8.2, metascore: null, type: "tv", short: "Loki S2" },
{ title: "The Marvels", year: 2023, imdb: 5.5, metascore: 50, type: "movie", short: "Marvels" },
{ title: "Echo", year: 2024, imdb: 5.9, metascore: null, type: "tv", short: "Echo" },
{ title: "Deadpool & Wolverine", year: 2024, imdb: 7.5, metascore: 56, type: "movie", short: "D&W" },
{ title: "Agatha All Along", year: 2024, imdb: 7.2, metascore: null, type: "tv", short: "Agatha" },
{ title: "What If...? S2", year: 2024, imdb: 7.3, metascore: null, type: "tv", short: "WhatIf S2" },
{ title: "Your Friendly Neighborhood Spider-Man", year: 2025, imdb: 7.5, metascore: null, type: "tv", short: "YFNSM" },
{ title: "Captain America: Brave New World", year: 2025, imdb: 5.6, metascore: 42, type: "movie", short: "CA:BNW" },
{ title: "Daredevil: Born Again", year: 2025, imdb: 8.1, metascore: null, type: "tv", short: "DD:BA" },
{ title: "Thunderbolts*", year: 2025, imdb: 7.1, metascore: 68, type: "movie", short: "T-Bolts" },
{ title: "Ironheart", year: 2025, imdb: 4.5, metascore: null, type: "tv", short: "Ironheart" },
{ title: "The Fantastic Four: First Steps", year: 2025, imdb: 6.9, metascore: 65, type: "movie", short: "FF" },
{ title: "Eyes of Wakanda", year: 2025, imdb: 6.2, metascore: null, type: "tv", short: "EoW" },
{ title: "Marvel Zombies", year: 2025, imdb: 7.0, metascore: null, type: "tv", short: "Zombies" },
];
const getColor = (type) => {
const colors = { movie: '#FBBF24', tv: '#3B82F6', special: '#8B5CF6', short: '#10B981' };
return colors[type] || '#9CA3AF';
};
new Chart(document.getElementById('myChart'), {
type: 'line',
data: {
labels: data.map(d => d.short),
datasets: [{
label: 'IMDB Rating',
data: data.map(d => d.imdb),
borderColor: '#FBBF24',
backgroundColor: data.map(d => getColor(d.type)),
pointRadius: 4,
pointHoverRadius: 6,
tension: 0.1
}, {
label: 'Metascore (÷10)',
data: data.map(d => d.metascore ? d.metascore / 10 : null),
borderColor: '#10B981',
borderDash: [5, 5],
pointRadius: 3,
pointHoverRadius: 5,
tension: 0.1
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
plugins: {
legend: { labels: { color: '#9CA3AF' } },
tooltip: {
callbacks: {
title: (items) => data[items[0].dataIndex].title,
label: (item) => {
const d = data[item.dataIndex];
if (item.datasetIndex === 0) return `IMDB: ${d.imdb}/10`;
return d.metascore ? `Metascore: ${d.metascore}/100` : null;
}
}
}
},
scales: {
x: { ticks: { color: '#9CA3AF', maxRotation: 45, minRotation: 45 }, grid: { color: '#374151' } },
y: { min: 3, max: 9, ticks: { color: '#9CA3AF' }, grid: { color: '#374151' } }
}
}
});
document.getElementById('chart').style.height = '600px';
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment