Game sale >5 Million with Brushing

100%

Game sale >5 Million with Brushing

✓ Published0🌍 Public

Last edited Nov 9, 2021

Created on Nov 9, 2021

A D3 scatter plot displays video game sales over time, plotting each game's release year against its global sales figures. Users drag a rectangular brush across the chart to highlight selected points in pink while dimming others, and a hidden table populates with the game name, year, and sales data for brushed points. The visualization uses d3.brush for selection, d3.axisBottom and axisLeft for scales, and loads CSV data from a GitHub-hosted Kaggle dataset.

AI-generated description

A vanilla HTML implementation of a D3 scatter plot. Shows the (https://gist.github.com/Rochelle-Wu/4e7515233d56de364f848f91ae25101d).

The X-axis is year

The Y-axis is the data of global sales

Thanks for Sitanshu Rupani's work, which bring me inspiration

The data comes from https://www.kaggle.com/gregorut/videogamesales

MIT Licensed

Similar vizzes

Loading thumbnail…

Game sale with Brushing

This scatter plot visualizes video game sales data from Kaggle, plotting global sales against year of release. Users can brush a rectangular region over the plot to select and highlight specific data points in pink, while unselected points dim to gray. Upon brush completion, a table appears listing the game name, year, and global sales for all highlighted entries. The visualization leverages d3.brush for interaction, d3.csv for data loading, and standard d3.scaleLinear, d3.axisBottom, and d3.axisLeft for the axes and scales.

RRochelle

94% match

Loading thumbnail…

D3 Scatter Plot for Video Game Sales

This D3 v6 scatter plot visualizes global video game sales across years, with each point representing a game and its platform encoded by color. Using SVG rendering, it scales the x-axis by year and y-axis by sales, allowing viewers to compare platform performance over time. The chart includes a d3.brushX brush for interactive selection and highlighting of data ranges, with d3.scaleLinear handling axis scales. Data comes from Kaggle’s video game sales dataset, parsed from CSV via d3.csv.

RRochelle

85% match

Loading thumbnail…

Scatter Plot For > 5 million Video Game Sales -brush

This scatter plot visualizes over 5 million video game sales, comparing global sales against year for various platforms. Users can select different quantitative variables—such as North America, EU, or Japan sales—for the x- and y-axes via custom dropdown menus. The chart uses d3.scaleLinear, d3.axisBottom, and d3.axisLeft, with d3.brush enabling interactive selection of data points. Animated transitions via d3.transition and selection.join update circle positions and radius. Data comes from a CSV file loaded with d3.csv.

RRochelle

85% match

Loading thumbnail…

vgsales.csv with brushing

This interactive visualization uses the vgsales.csv dataset to show video game release counts by year. A bottom line chart displays total releases per year, and users can brush over a year range to generate a bar chart above showing the distribution of game releases across platforms within that selection. The visualization is built with D3 v6, using `scaleLinear`, `scaleBand`, `flatRollup`, and a brush selection to filter and aggregate the data, rendering both SVG charts from CSV data loaded via `d3.csv`.

DDaniel Ribaudo

80% match

Loading thumbnail…

D3 Scatter Plot for Video Game Sales

This scatter plot visualizes video game sales data from Kaggle, showing global sales figures against release year for each title. The visualization uses D3 v6 with an SVG rendering approach, employing `d3.csv` for data loading, `scaleLinear` for both axes, and `axisLeft`/`axisBottom` for tick generation. Circles are positioned using x/y coordinates derived from the year and sales values, with a fixed radius of 5 pixels, and the chart fills the entire browser window using `window.innerWidth` and `window.innerHeight`.

RRochelle

80% match

Loading thumbnail…

Scatter Plot For > 5 million Video Game Sales

This interactive scatter plot visualizes over 5 million video game sales, using the d3 library to map various sales figures (such as North American, European, or global sales) to the x and y axes. Users can dynamically change the axes through HTML menus, with each point colored by the game's platform, such as Wii or PS. The SVG chart animates transitions via d3's `transition` API as selections change, and the chart is built with reusable, modular charts as seen in the `scatterPlot` and `menu` JavaScript files.

RRochelle

77% match

Loading thumbnail…

D3 Scatter plot

This scatter plot visualizes the global sales of top-rated video games from 2016, with each game represented as a circular point. The data, loaded from a local CSV file, maps game names along the x-axis and their sales figures in millions along the y-axis. The visualization is built with D3 v6, using functions like `d3.scaleBand` and `d3.scaleLinear` to manage the axes, while `d3.select`, `d3.append`, and `d3.axisBottom` handle the SVG element creation and axis rendering. Each dot is positioned using the computed scales, and steelblue fill distinguishes the data points.

KKwasi Acquaye

76% match

Loading thumbnail…

D3 Scatter Plot of Top Video Game Sales showing Release Year (X) vs. Global Sales in Millions (Y)

This D3 scatter plot visualizes top video game sales, mapping release year on the x-axis against global sales in millions on the y-axis. Each circle represents a game, with its position determined by the `scaleLinear` scales and `extent` functions, while `axisLeft` and `axisBottom` render the axes. The SVG is sized to the browser window, and data is loaded from a CSV via `d3.csv`, with rows parsed to convert numeric strings to numbers. The plot fills the viewport, allowing exploration of sales trends across gaming history.

TT-Reiser

76% match