Fork of Fork of Video Game Platforms Streamgraph

100%

Fork of Fork of Video Game Platforms Streamgraph

✓ Published0🌍 Public

Last edited Nov 2, 2023

Created on Nov 1, 2023

Forked from Fork of Video Game Platforms Streamgraph

This streamgraph visualizes global video game sales across platforms from 1970 to 2020, showing how each console's market share shifts over time. The visualization uses D3’s stack generator with the wiggle offset and inside-out order to create the layered streamgraph shape, with smoothed data via array-blur. Area labels are placed using the d3-area-label library, while color is assigned through an ordinal scale with HCL color space. The data comes from a CSV of video game sales, rendered as an SVG with axis ticks providing temporal context.

AI-generated description

This is a streamgraph visualizing this Video Game Dataset. It is meant to show the relative Global Sales of games for each console over the years.

ISC Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Video Game Platforms Streamgraph

This streamgraph visualizes global video game sales by platform from 1980 to 2020, showing how platforms like PlayStation, Xbox, and Nintendo rise and fall in popularity over time. Built with D3.js, the visualization uses `d3.stack` with a wiggle offset and inside-out ordering to minimize layer overlap. Sales data from a GitHub-hosted CSV is aggregated yearly, smoothed with `array-blur`, and rendered as SVG paths with a black backdrop to hide grid lines between layers. Hovering over any platform highlights it while dimming the rest.

ZZach2826

95% match

Loading thumbnail…

Fork of Video Game Platforms Streamgraph

This streamgraph visualizes global video game sales across platforms and years, using a smoothed area chart that highlights sales distributions over time. The code loads CSV data from a GitHub gist and employs D3’s `rollup`, `stack`, `stackOffsetWiggle`, and `stackOrderInsideOut` APIs to aggregate and layer the data. Rendering with SVG, it uses `d3.scaleTime`, `scaleLinear`, `area`, and the `d3-area-label` library for labels. A black envelope path and hover effects enhance layer separation.

CCurran Kelleher

93% match

Loading thumbnail…

Video Game Platforms Streamgraph

This streamgraph visualizes global video game sales by platform over time, using a D3 stack layout with wiggle offset to create the flowing layered form. The data comes from a CSV file containing yearly sales figures, smoothed with array-blur for visual clarity. Colors are generated using d3.hcl and randomNormal, while the streamgraph is rendered as SVG with d3.area and labeled using d3-area-label. Hovering highlights a platform by inverting its fill to black with a white stroke.

DDaniel Ribaudo

92% match

Loading thumbnail…

Fork of Fork of Fork of Videogame sales (Platform v/s Global Sales)

This scatterplot shows the relationship between video game platforms and their global sales figures, with each circle representing a game and its position indicating sales volume. The visualization reveals that most games cluster at lower sales levels, with a few notable outliers achieving significantly higher sales. The chart uses Vega-Lite's API through the vega-lite-api library, configuring circle marks with opacity for overlapping points. Data comes from a CSV file loaded via d3.csv, and the visualization renders as an SVG using Vega's renderer with custom styling for improved readability.

Ppemmasaniprudhvinadh

82% match

Loading thumbnail…

Fork of Videogame sales (Platform v/s Global Sales)

This visualization plots global sales of video games against gaming platforms using a circular scatterplot. Each circle’s position encodes the platform on the y-axis and the game’s global sales on the x-axis, with opacity used to show overlapping points. The chart uses Vega-Lite and the vega-lite-api to construct the markCircle encoding, while d3.csv loads the Videogame Sales dataset from a GitHub gist. Tooltips display game names on hover. The visualization is rendered as an SVG, with config.js customizing axes and text styling.

Ppemmasaniprudhvinadh

81% match

Loading thumbnail…

Fork of Fork of Videogame sales (Platform v/s Global Sales)

This visualization displays global sales for individual video games across different platforms, with each circle representing a game and its position showing sales volume. The chart reveals that most games sell similarly across platforms, though notable outliers exist with significantly higher sales. Built with Vega-Lite and d3.v5, the visualization loads data from a CSV file containing games with sales exceeding 100,000 copies, using circular marks with encoded x-axis for quantitative sales values and categorical platform labels on the y-axis.

Ppemmasaniprudhvinadh

80% match

Loading thumbnail…

Fork of Videogame sales (Platform v/s Global Sales)

This visualization uses a bar chart to compare global video game sales across different platforms, revealing that most platforms achieve similar sales totals with a few notable outliers. The chart is built with D3.js and Vega-Lite, loading data from a CSV hosted on GitHub. The code configures the visualization with the `vl.drawBar` API, encodes platform on the y-axis and global sales on the x-axis, and uses a tooltip to display individual game names.

Ppemmasaniprudhvinadh

80% match

Loading thumbnail…

Fork of Videogame sales (Platform v/s Global Sales)

A circular scatterplot charts global video game sales for each platform using the Vega-Lite API with d3.csv loading the gist-hosted dataset. Each circle encodes a game’s total global sales along the x-axis, grouped by platform on the y-axis, with tooltips revealing the game title. The visualization reveals that most platforms show similar sales distributions, with occasional high-selling outliers. The code configures axes, font sizes, and colors through a custom config object, while the plot itself uses a markCircle encoding with transparent fill and adjusted scales to emphasize the outlier patterns.

Ppemmasaniprudhvinadh

79% match