Fork of Bar graph-task1q1

100%

Fork of Bar graph-task1q1

✓ Published0🌍 Public

Last edited Jul 17, 2023

Created on Jul 17, 2023

This visualization presents a horizontal bar chart of North American video game sales for the top 12 games, sourced from a CSV file. Built with React and D3 v5, it uses `scaleBand` for the y-axis and `scaleLinear` for the x-axis, rendering bars as SVG rectangles. The chart includes tick lines and labels drawn manually. A second, unused component in the same file defines a 3D scatter plot using Plotly, showing North America and Japan sales over time.

AI-generated description

A whole smiley face

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Bar graph-task1

This bar chart displays North American sales for the top twelve video games, with each game's name on the vertical axis and its sales figures on the horizontal axis. The visualization is built using React and D3 v5, employing `d3.csv` to load the dataset and `d3.scaleBand` and `d3.scaleLinear` to map the data to SVG rectangles. The chart is rendered with red gridlines and labeled axes. While the primary view is a horizontal bar graph, the code also contains a separate Plotly-based 3D scatter plot that compares North American and Japanese sales over time, indicating the source data includes multiple regional sales metrics.

Cchandanagandla

93% match

Loading thumbnail…

Fork of Bar graph-task1

This example shows a horizontal bar chart of North American video game sales for the top twelve titles, ranked by their NA_Sales values from a CSV dataset. The chart uses D3 scales (scaleBand for categories and scaleLinear for values) to position bars and axis ticks, while React manages the component state and data loading. The visualization renders as an SVG with red gridlines and labeled axes, using d3.csv to fetch and parse the data, and d3.max to determine the x-axis domain.

Aajaysonu

92% match

Loading thumbnail…

Fork of Bar graph-task1

This example shows a horizontal bar chart of the top 12 video games by North American sales, with game names on the y-axis and sales values on the x-axis. It uses React state to load CSV data via d3.csv, then renders SVG rectangles scaled by d3.scaleBand and d3.scaleLinear. Custom gridlines and tick labels are drawn manually using d3.scaleLinear.ticks, while axes are positioned with SVG group transforms. The visualization updates asynchronously when data arrives, with a loading state displayed beforehand.

Aajaysonu

90% match

Loading thumbnail…

Bar graph-task1

This interactive bar chart, built with React and D3 v5, visualizes the top 12 video games by their North American sales figures. Each game is represented by a rectangular bar, with the horizontal axis encoding sales value and the vertical axis categorizing game titles. The chart is rendered as an SVG within a React component, using D3's `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis, with data loaded from a CSV file via `d3.csv`. A second, separate plotly-based 3D scatter plot is also included in the project files, but the main gallery view shows the D3 bar graph.

SSheela2930

88% match

Loading thumbnail…

Fork of A Bar Chart(Platform)

This interactive bar chart displays total video game sales across platforms, with a dropdown menu to switch between global, EU, JP, NA, and other regional sales figures. Built with React and D3 v5, it uses `scaleBand` and `scaleLinear` to position SVG rectangles, with axes rendered through custom `AxisBottom` and `AxisLeft` components. Data comes from a Kaggle dataset of the top 500 games, loaded via D3's `csv` method. A tooltip appears on hover, showing the exact sales value for each bar.

NNarayana Reddy

84% match

Loading thumbnail…

Assignment2-Task_1_Bar graph

This bar chart displays the top 12 video games by North American sales from a CSV dataset. Each bar’s height corresponds to the game name on the y-axis, while the bar’s length represents total sales on the x-axis, with a red-to-blue color scale indicating sales magnitude. The visualization uses React for component rendering and D3’s `csv`, `scaleBand`, `scaleLinear`, and `axisBottom`/`axisLeft` APIs within an SVG. Data is fetched from a GitHub gist and processed with D3’s CSV loader.

Ssreekarthanda@gmail.com

84% match

Loading thumbnail…

Fork of A Bar Chart(Platform)

The visualization shows total video game sales across platforms, with a bar chart for each platform and a dropdown menu to switch between global, EU, JP, NA, and other regional sales. Built with React and rendered as SVG, it uses D3’s `scaleBand` for the categorical x-axis and `scaleLinear` for the numeric y-axis. The data is loaded from a CSV via D3’s `csv` parser, with axes and marks generated as React components.

YYR2388

84% match

Loading thumbnail…

Fork of A Bar Chart(Publisher)

This interactive bar chart displays global video game sales by publisher, with a dropdown menu to switch between sales regions (Global, EU, JP, NA, Other). The React-based visualization uses D3 v5 scales and axes (scaleBand, scaleLinear) to render SVG rectangles, with tooltips via SVG `<title>` elements. Data originates from Kaggle’s video game sales dataset, loaded as CSV using D3’s `csv` parser.

RRED98310

83% match