Scatter Plot_Group H

100%

Scatter Plot_Group H

✓ Published0🌍 Public

Last edited Jun 11, 2018

Created on Jun 11, 2018

This scatter plot visualizes movie data, mapping IMDB rating on the x-axis and production budget on the y-axis. Each circle represents a movie, with its size encoding return on investment (ROI) and its color indicating genre (e.g., Action, Drama, Adventure) via a legend. Hovering over a circle highlights it in yellow and displays a tooltip with the movie name and ROI. The visualization uses D3 v4 with SVG rendering and smooth animations to support interactive exploration of the relationship between movie ratings, budgets, and profitability.

AI-generated description

Part of the Data Visualization Course in IE School of Human Sciences and Technology. Code was adapted from YouthBrea's block: Scatter Plot and changed to the match the dataset that was used.

An example scatter plot with color legend using D3 and d3-legend.

This scatter plot shows the dataset of Movies. Originally published at http://app.rawgraphs.io/, this small dataset records Movies records, including the Production budget, Box Office returns, ROI and IMDB ratings.

In this scatter plot, Y axis is the ratings present on the IMDB site and X axis is representing the production budget for each movie. Each circle one movie and the size of the circle represents the ROI for the movie. Each colour of the circle represents a different genre and hovering over the circle would show the name of the movie and the ROI of the specific movie.

forked from <a href='http://bl.ocks.org/YouthBread/'>YouthBread</a>'s block: <a href='http://bl.ocks.org/YouthBread/6b406e4d96f23ce64c1f7cb745b0722a'>Scatter Plot</a>

mit Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot

This interactive scatter plot visualizes movie data, plotting IMDb ratings on the x-axis against production budgets on the y-axis, with each point sized by return on investment (ROI) and colored by genre. Built with D3 v4, the SVG chart includes labeled axes for Rating and Production Budget, and a color legend generated using the d3-legend library. Hovering over a circle changes its fill to pink and displays a tooltip with the exact values. The visualization also includes a bold title and animated transitions, with data sourced from a Gist by alvarorueda89 and styled using the Open Sans font.

Aalvarorueda89

94% match

Loading thumbnail…

Data Viz 3 Group C

This interactive scatterplot visualizes the relationship between movie budget and revenue from a dataset of 15 films. Revenue is mapped to the x-axis, budget to the y-axis, with circle size encoding return on investment (ROI) and color distinguishing genre. Hovering over a circle enlarges it and displays a tooltip with the movie name, exact revenue, and budget. Clicking a genre in the legend filters the display to show only that genre; clicking again restores all genres. The plot includes axes labeled "Revenue in millions" and "Budget in millions" and uses an animated hover effect to enhance detail-on-demand exploration. Built with D3 v3 and blockbuilder.org.

Aannieypi

87% match

Loading thumbnail…

Scatter Plot

A scatter plot displays movie gross collections against budgets, with each point colored by MPAA rating and sized proportionally to gross earnings. The visualization uses D3 v3 with SVG rendering, including d3.svg.axis for axes, d3.scale.sqrt for point sizing, and d3.scale.category10 for color encoding. A d3-tip tooltip reveals movie title and gross on hover. Data originates from a tab-separated file listing movie attributes.

MMrajyalakshmi

84% match

Loading thumbnail…

Scatter Plot

This scatter plot visualizes movie success by plotting gross collections against budgets, with each point’s size encoding gross revenue and its color representing MPAA rating (PG, PG-13, R). The chart uses D3 v3 with SVG rendering, including linear scales for axes, a sqrt scale for point radii, and a category10 color scale for categorical ratings. Hovering a point reveals a tooltip built with d3.tip showing the movie title and gross earnings. Data is loaded from a local TSV file using d3.tsv.

MMrajyalakshmi

83% match

Loading thumbnail…

Scatter Plot

This interactive scatter plot visualizes movie data, comparing three variables—budget, gross revenue, and IMDB score—through user-selectable dropdown menus. The visualization uses D3 v5’s `scaleLinear`, `axisLeft`, `axisBottom`, and `csv` to load and render the data as animated SVG circles. Each axis is controlled via a dropdown menu, and points transition smoothly into position over one second, with axis labels and tick marks generated dynamically. The data is sourced from a local CSV file.

Ssourcebox-bug

83% match

Loading thumbnail…

Scatterplot

This scatterplot visualizes the top 50 Hollywood films released from 2007 to 2011, plotting each film’s budget (in $m) on the x-axis against audience ratings (in %) on the y-axis. Built with D3 v3, the SVG-based chart animates the circles in a cascading sequence using staggered transitions, and includes hover interactions that display a tooltip with the film’s title, budget, and audience rating. Styling features a warm cream background, rose-colored circles that darken on hover, dashed axes, and percentage-formatted y-axis tick labels.

CClevejones

83% match

Loading thumbnail…

Scatter Plot

This interactive scatter plot explores relationships among movie budget, gross revenue, and IMDb scores using data loaded from a CSV file. Dropdown menus let users select which three measures to compare on the x-axis, y-axis, and color scale. The visualization uses D3 v5’s `scaleLinear`, `axisLeft`, and `axisBottom` to render animated SVG circles that transition from the chart’s center to their final positions. A modular `dropdownMenu` component and reusable `scatterPlot` function structure the code for maintainability.

Ddrmurugesh

82% match

Loading thumbnail…

Gist 084750a10fa41a3849235a117dec0b7b

This visualization plots movie production budget against box office earnings, with each film’s genre, ROI, and IMDb rating encoded through color, size, and position. Using a scatterplot rendered with D3.js, it employs `d3.forceSimulation` to arrange overlapping points and `d3.scaleOrdinal` for genre-based coloring. Data comes from the included `movies.csv` file, with axes scaled linearly to handle outliers like *Avatar* and *ET*.)

CCarlosVelamazan

82% match