Skip to main content
SimilarExport ZIP
100%

Week 11: IMDB Top 250 Movies Histogram: Distribution of Movie Runtimes by Genre

✓ Published1🌍 Public
XXiaojun
Last edited Nov 1, 2025
Created on Nov 1, 2025

This histogram shows the distribution of movie runtimes for the top 250 IMDB movies, broken down by genre with stacked bars at 10-minute intervals, distinguishing the six most frequent genres from an "Other" category. The chart uses D3 v7’s `bin` and `scaleLinear` functions to create and scale the bins, while `scaleOrdinal` with `schemeSet2` applies colors. Data comes from a CSV file containing runtime, genre, and other movie attributes, parsed into minutes and genre lists by a custom parser.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Week 9: IMDB Top 250 Movies Histogram: Distribution of Movie Runtimes by Genre

This stacked histogram visualizes the distribution of movie runtimes across the top six most frequent genres from the IMDB Top 250 dataset, using 10-minute bins. It shows how each genre's movie count contributes to the total for each runtime interval. The visualization uses D3's `scaleLinear`, `bin`, and `scaleOrdinal` APIs to create the bars, with categories sorted by frequency and an "Other" grouping for remaining genres. The legend identifies color assignments for each genre.

XXiaojun
97% match
Loading thumbnail…

Week 10: IMDB Top 250 Movies Histogram: Distribution of Movie Runtimes by Genre

This histogram visualizes the distribution of movie runtimes for the top 250 IMDB movies, broken down by genre as a stacked bar chart. Using D3.js and React, the visualization filters the data to the six most common genres, categorizes all others as "Other," and bins runtimes into 10-minute intervals. Each bar segment is colored via `d3.scaleOrdinal` and `d3.schemeSet2`, with axes rendered by `d3.axisBottom` and `d3.axisLeft`. The chart reads from a CSV file containing movie metadata.

XXiaojun
97% match
Loading thumbnail…

Week 12: IMDB Top 250 Movies Histogram: Distribution of Movie Runtimes by Genre

This stacked histogram shows the distribution of movie runtimes across the top 6 genres in the IMDB Top 250 list, with each bar broken into colored segments for genres like Drama, Crime, and Action. The chart uses D3 v7's `scaleLinear`, `scaleOrdinal` with `schemeSet2`, and `bin` functions on a 10-minute interval to aggregate data parsed from a CSV. The React app loads the dataset, filters out null runtime values, and categorizes movies without a top genre as “Other.”

XXiaojun
96% match
Loading thumbnail…

Week 6: IMDB Top 250 Movies Histogram: Distribution of Movie Runtimes by Genre

This visualization shows the distribution of movie runtimes across the top 6 genres in the IMDB Top 250 list, using stacked histograms to display genre frequency within 10-minute runtime bins. The code uses React with D3 v7, employing `d3.bin` for binning, `d3.scaleLinear` for axes, and `d3.scaleOrdinal` with `d3.schemeSet2` for genre colors. Runtime data is parsed from the CSV's `run_time` field, and genres are categorized with an "Other" fallback.

XXiaojun
96% match
Loading thumbnail…

Week 5: IMDB Top 250 Movies Histogram: Movie Runtime Distribution

This histogram visualizes the distribution of runtimes for IMDB's Top 250 movies, using 20-minute bins to show the frequency of films across different durations. The visualization is built with React and D3 v7, employing `select`, `scaleLinear`, `extent`, `max`, and `bin` from the D3 API to bin the data and map values to screen coordinates. It plots a green bar chart with labeled x-axis (run time in minutes) and y-axis (frequency), with axes rendered via `axisBottom` and `axisLeft`. The dataset, sourced from Kaggle's IMDB Top 250 Movies list, is parsed from CSV using a custom runtime parser to convert time strings to numeric minutes.

XXiaojun
90% match
Loading thumbnail…

Week 11: IMDB Top 250 Movies Scatter Plot: Rating vs. Runtime

A scatter plot displays the IMDB top 250 movies' ratings against their runtimes, with each point colored by its simplified genre. A dropdown filter allows viewing movies from a specific decade. The visualization uses D3 version 7 to project the data, with scales created via `scaleLinear`, a color mapping via `scaleOrdinal` and `schemeTableau10`, and axes rendered through `axisBottom` and `axisLeft`. The code processes movie data from a CSV file, including a custom genre preprocessing step, before rendering circles with hover tooltips that display the film's title, director, and release year.

XXiaojun
85% match
Loading thumbnail…

Week 9: IMDB Top 250 Movies Movie Bubble Chart: Movie Runtime Trends Over Time

This bubble chart displays the relationship between the release year and runtime of the top 250 IMDB movies, with each bubble’s size representing its rating and its color indicating a simplified genre. The visualization reveals a general trend of increasing movie runtimes over time. It uses a React frontend with d3.v7’s `scaleLinear`, `scaleOrdinal`, and `axisBottom` to map data. Data is preprocessed from a CSV file, with runtimes parsed from strings like “2h 22m” into minutes. The genre legend allows interactive highlighting, filtering bubbles by genre on click or hover.

XXiaojun
84% match
Loading thumbnail…

Week 6: IMDB Top 250 Movies Bar Chart: Genre VS Count

A bar chart visualizes the distribution of genres among the IMDb Top 250 movies, with each bar's height representing the count of movies in that genre and a tooltip showing the exact count and percentage. The visualization uses the D3.js library, including `scaleBand` and `scaleLinear` for axes and `axisBottom` and `axisLeft` for tick marks. Data is loaded from a CSV file, and genres are split and counted from a comma-separated field. The chart uses a Seaborn-derived color palette with interactive hover effects that highlight the selected bar and dim others.

XXiaojun
84% match