Fork of Bar Chart

100%

Fork of Bar Chart - Project

✓ Published0🌍 Public

Last edited Apr 9, 2023

Created on Apr 9, 2023

This bar chart visualization displays the global sales of video games by genre, using data loaded from a CSV file. The chart uses D3 v6 scales (`scaleBand`, `scaleLinear`) and axes (`axisBottom`, `axisLeft`) to render the bars, which are colored steel blue. It includes interactive hover effects, where bars transition to orange on mouseover and return to steel blue on mouseout, with the color change animated over 250 milliseconds using D3's transition API.

AI-generated description

A demonstration of how to start using D3 version 6.

MIT Licensed

Similar vizzes

Loading thumbnail…

This example displays a vertical bar chart comparing global sales across video game genres, using data loaded from a CSV file. The chart renders as SVG, with genre labels on the x-axis and sales figures on the y-axis. The code builds scales with d3.scaleBand and d3.scaleLinear, and uses d3.axisBottom and d3.axisLeft for axes. Interactive mouseover and mouseout events change bar fill colors from steelblue to orange, with a d3 transition animating the change back over 250 milliseconds.

Kkaruppuraja

94% match

Loading thumbnail…

Fork of Bar Chart

This fork of a bar chart visualizes global video game sales by genre, using data from a CSV file. Built with D3 v6, it renders an SVG with animated bars, implementing scales via `scaleLinear` and `scaleBand`. Bars are colored steel blue and change to orange on mouseover, with the transition handled by `.transition().duration(250)`. Axes and labels are created using `axisLeft` and `axisBottom`.

Ssurajkrishna

94% match

Loading thumbnail…

Fork of Bar Chart

This bar chart visualizes global sales for different video game genres, sourced from a CSV file, with a D3 v6 rendering. It uses `csv`, `scaleBand`, `scaleLinear`, `axisBottom`, and `axisLeft` to map genres to bars and provide axes. On mouseover, the chart changes a bar’s fill to orange and back to steelblue on mouseout via D3’s selection and transition methods. The SVG output includes data labels for axes and a rotated genre title.

Ssucotton9

94% match

Loading thumbnail…

Fork of Bar Chart

This fork of a bar chart visualizes global video game sales by genre, using data loaded from a CSV file. D3 v6 APIs such as `scaleBand`, `scaleLinear`, `axisLeft`, and `axisBottom` construct the chart within an SVG, while mouseover and mouseout events trigger `transition` animations that change bar fill from steelblue to orange. The chart includes labeled axes for genre and global sales, with bars rendered via `selectAll` and data joins.

MMaldewar

94% match

Loading thumbnail…

Fork of BarChart

This visualization displays global video game sales by genre, using a bar chart to compare units sold across categories like Action, Shooter, and Platform. The chart is built with D3 v6, using `scaleBand` for the x-axis, `scaleLinear` for the y-axis, and SVG rectangles for the bars. Bars animate their fill color to orange on mouseover and transition back to steelblue on mouseout. The data, sourced from Kaggle, is loaded as CSV and parsed, with axes and labels rendered via `axisBottom` and `axisLeft`.

AAditya Khandelwal

93% match

Loading thumbnail…

Fork of Bar Chart

This bar chart visualizes global video game sales by genre, from Action’s 563 million units to Strategy’s 23 million. Built with D3 v6, it uses `scaleBand` for the categorical x-axis and `scaleLinear` for the numeric y-axis, drawing SVG rectangles from CSV data. Interactive hover effects transition bars from steelblue to orange, and mouseout reverts them via `transition.attr` over 250 milliseconds. Axis labels and titles are appended as SVG text elements.

AAkrutiKhurana2103

93% match

Loading thumbnail…

Bar Chart

This bar chart visualizes global sales by video game genre, ranking categories like Action and Shooter from highest to lowest on a linear scale. Using D3 version 6, the code loads CSV data via `d3.csv` and draws SVG rectangles with `d3.selectAll`. The axes are created with `d3.axisBottom` and `d3.axisLeft` on band and linear scales. Rectangles change fill color from steelblue to orange on mouseover, then transition to red on mouseout with a 250ms duration.

Ppavan0828

87% match

Loading thumbnail…

BarChart

This bar chart shows the global sales of video games by genre, ranking categories like Action and Shooter by their total sales in millions. The visualization uses D3 v6 to load CSV data from a GitHub gist, and renders the chart as an SVG with animated transitions. It employs `scaleBand` for the x-axis and `scaleLinear` for the y-axis, with axes generated by `axisBottom` and `axisLeft`. Bars are filled steelblue and change to orange on mouseover, using D3’s selection and transition APIs.

AAditya Khandelwal

87% match