treemap-Video Game Sales

100%

treemap-Video Game Sales

✓ Published3🌍 Public

Last edited Jan 6, 2020

Created on Jan 6, 2020

Forked from Untitled

This interactive treemap visualizes the top 100 best-selling video games, grouped by gaming platform, with each tile’s size and color representing sales value and platform category. Hovering over a tile displays a tooltip with the game’s name, platform, and sales figures. The visualization uses D3 v4’s `d3.treemap()` and `d3.hierarchy()` to layout the hierarchical data, which is loaded as JSON from an external source, and renders to SVG.

AI-generated description

An example showing the capabilities of VizHub.

MIT Licensed

Similar vizzes

Loading thumbnail…

Treemap of video game sales example

This treemap visualizes the top 100 most-sold video games, grouped by platform. The code uses d3.treemap to compute the layout and renders it as SVG rectangles with categorical color scales. Hovering over a tile displays a tooltip with the game’s name, category, and sales value. The dataset is loaded from a JSON file, and the example supports switching between video game, movie, and kickstarter datasets via URL parameters.

Hhelloelectro

93% match

Loading thumbnail…

Video Game Sales - TreeMap Diagram

A treemap visualization displays the top 100 most-sold video games grouped by platform, with each rectangular tile sized by sales value and colored by category. The interactive chart uses React for component structure and D3 v7’s `treemap` layout with the `treemapResquarify` tiling algorithm to partition the data hierarchy. A hover tooltip shows the game name, category, and sales figures, while a legend maps colors to platform categories. The visualization loads JSON data from the freeCodeCamp dataset and renders as SVG.

MMohammed Banani | MbDev

91% match

Loading thumbnail…

Fork of treemap-Video Game Sales

This example visualizes video game sales data using a treemap, grouping the top 100 most-sold games by their platform (e.g., Wii, NES, DS). It displays the relative sales value of each title by the area of its corresponding rectangle. The visualization is built with D3.js v4, using `d3.treemap` and `d3.hierarchy` to compute the layout, and renders tiles as SVG rectangles with color-coded categories. Hovering over a tile triggers a tooltip, and the dataset is loaded from an external JSON URL.

Ddr-acc

91% match

Loading thumbnail…

Treemap from bl.ocks.org

A treemap displays the top 100 best-selling video games, grouped by platform and sized by sales value in millions. Built with D3 v4, the visualization uses `d3.treemap` with a resquarify tiling algorithm, `d3.hierarchy` for data nesting, and `d3.scaleOrdinal` with a faded category color scheme. SVG rectangles represent each game, with clip-paths and text elements for labels, while the data comes from a local JSON file. The layout is rendered with rounded padding and no animation in the current version.

Ssriramvsharma

90% match

Loading thumbnail…

Fork of Video Game Sales - TreeMap Diagram

This interactive tree map visualizes the top 100 best-selling video games, grouped by platform, using a hierarchical treemap layout with `d3.treemap` and the `treemapResquarify` tiling algorithm. Each rectangle represents a game, colored by category, with labels split across multiple lines. The visualization is built with React and D3 v7, rendering SVG elements that respond to mouse hover events to display a tooltip showing the game’s name, category, and sales value. The color legend categorizes platforms, and data is loaded from the freeCodeCamp video game sales JSON dataset.

Aantoniojl-kemaro

89% match

Loading thumbnail…

Untitled

This example displays a treemap visualization of hierarchical data, with the current view showing video game sales grouped by platform, or movie and Kickstarter data sets selectable via links at the top. It uses the d3 v4 API, specifically `d3.treemap()`, `d3.hierarchy()`, and `d3.scaleOrdinal` with the `schemeCategory20` color palette, to render the nested rectangles. The SVG output includes tooltips on mouseover, which display the name, category, and value of each tile using data attributes.

Vvaynexie

81% match

Loading thumbnail…

Video Games Sales

This visualization displays the top 20 video games ranked by global sales in millions, with each game shown as a vertical bar. The bar chart shows sales values on the y-axis and game names on the x-axis, with rotated labels for readability. The code uses D3.js `d3.csv` to load and parse the video game sales dataset, then applies `d3.scaleBand` and `d3.scaleLinear` for positioning. The chart includes axes via `d3.axisBottom` and `d3.axisLeft`, with bars rendered as SVG rectangles colored steelblue.

Ssamozarif@gmail.com

77% 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

76% match