Skip to main content
SimilarExport ZIP
100%

ACT6_TASK4.2

✓ Published1🌍 Public
RRevanth putta
Last edited Oct 26, 2025
Created on Oct 26, 2025

This visualization displays movie runtime trends over time, with each bubble representing a film positioned by its release year and runtime in minutes, while the bubble size encodes its rating and the color indicates its simplified genre. The chart uses D3.js v7's `scaleLinear`, `scaleOrdinal`, and `schemeSet2` to map the data, and includes interactive legend items that highlight bubbles of a selected genre on click or hover. Data is loaded from a CSV file and preprocessed in React, with runtime strings converted to minutes and genres consolidated to the top seven categories.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_task4_question

This bubble chart visualizes movie runtime trends over time for top-rated films from IMDb, with each circle’s radius scaled by rating and color-coded by simplified genre. The D3 v7 visualization uses `scaleLinear` for year, runtime, and radius scales, plus `scaleOrdinal` with `schemeSet2` for genre colors. Data preprocessing splits multi-genre entries into top seven genres via `preprocessGenres`, while `parseRuntime` converts duration strings to minutes. An interactive legend allows highlighting specific genre bubbles through mouseover events and click-based filtering.

Mmaneeshraja47@gmail.com
91% match
Loading thumbnail…

Activity6_Question4

This scatterplot visualizes movie runtime against rating, with each fixed-radius circle representing a film and colored by simplified genre. The chart includes hover tooltips displaying movie name, primary director, and release year. Data loads from a CSV and is preprocessed using custom genre aggregation, runtime parsing, and numeric conversion logic. The visualization is built with React and D3 v7, using `scaleLinear`, `scaleOrdinal`, `schemeTableau10`, `axisBottom`, and `axisLeft` for axes, scales, and legends.

Mmaneeshraja47@gmail.com
88% match
Loading thumbnail…

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

This bubble chart displays IMDB’s top 250 movies, plotting each film’s release year against its runtime in minutes, with bubble size encoding rating and color representing the seven most common genres. The visualization uses D3 scales, including `scaleLinear` and `scaleOrdinal` with `schemeSet2` for categorical coloring. React manages the data-loading lifecycle, while D3’s `select` and `join` methods handle SVG rendering and updates. The chart includes labeled axes with formatted ticks, a legend, and a title, all positioned within configured margins.

XXiaojun
87% match
Loading thumbnail…

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

A bubble chart displays the IMDB Top 250 movies by release year on the x-axis and runtime in minutes on the y-axis, with circle size encoding ratings and color encoding genre. The visualization reveals trends in movie runtimes over time. Using D3.js v7 within a React app, the code loads data from a CSV, parses runtime strings, and applies scales for positioning, sizing, and coloring via `scaleLinear` and `scaleOrdinal`.

XXiaojun
87% 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
86% match
Loading thumbnail…

Fork of Week 6: IMDB Top 250 Movies Movie Bubble Chart: Movie Runtime Trends Over Time

A bubble chart maps the top 250 IMDB movies by release year (x-axis) and runtime in minutes (y-axis), with circle size encoding rating and color distinguishing simplified genres. The D3 v7 code uses a linear scale for axes and radius, an ordinal color scale from `schemeSet2`, and renders axes via `axisBottom` and `axisLeft`. Data is parsed from a CSV, with runtimes converted from strings like "2h 22m" to minutes. React manages the SVG lifecycle, passing filtered data to the `viz` function.

XXiaojun
86% match
Loading thumbnail…

Activity6_Task4

This visualization uses a bubble chart to explore correlations between movie rating ranges across six film genres. Each genre is represented as a circle positioned by the percentage of ratings in the 5.0-6.5 range (x-axis) and the 7.5-8.5 range (y-axis), with circle size encoding the percentage of mid-range 6.5-7.5 ratings. The genre data comes from a CSV file embedded in the code. The visualization uses D3.js v7 scales and axes, with SVG circles, tooltips on hover, and a distinctive color scheme mapping each genre to a unique hue.

Mm.maanvireddt761@gmail.com
82% match
Loading thumbnail…

Activity6_Task4

This bubble chart visualizes the distribution of movie ratings across six genres, using bubble size to represent the proportion of films within each rating category—from below 5.0 to above 8.5. Six genres are plotted along the y-axis while five rating categories form the x-axis, with larger circles indicating higher percentages. The visualization uses d3.csv to load the data and d3.scaleSqrt for bubble sizing, while d3.axisBottom and d3.axisLeft construct the axes. Interactive tooltips appear on hover, displaying the genre and its exact percentage for the “below 5.0” category, implemented through D3 event listeners.

Ssahithigovindaraju@my.unt.edu
82% match