Fork of NBA Players State Bar Chart

100%

Fork of NBA Players State Bar Chart

✓ Published0🌍 Public

Last edited Oct 22, 2024

Created on Oct 22, 2024

This interactive bar chart displays NBA player statistics for each of the 30 teams, letting viewers select both a team and a specific metric (points, field goals, rebounds, assists, steals, or blocks) via dropdown menus. For rebounds, bars split into offensive and defensive components with a color legend. The chart uses D3's `scaleBand` and `scaleLinear` for axes, renders bars as SVG `rect` elements with hover effects, and draws a mean line using D3's `line` generator. Data comes from a CSV of player stats, and the visualization is built with React and `react-dropdown` for controls.

AI-generated description

Description:

The bar chart visualizes the NBA Player State Dataset. It iterates the previous version, which is designed to depict LAL players score per game in 2020-2021 season. A horizontal line is depicted in the chart to emphasize the mean score.

Representations:

X-axis: Player's name
Bar: Each bar represents a player in the team.

What's new

Choose the team with the dropdown menu
Choose the Y-axis representation with the dropdown menu
For Rebounds, the bar is separeated into Offensive Rebounds and Defensive Rebounds
Add hover effects

MIT Licensed

Similar vizzes

Loading thumbnail…

NBA Players State Bar Chart

This interactive bar chart visualizes NBA player statistics across all 30 teams, with dropdown menus to select a team and a statistical category such as points, rebounds, or assists. For rebounds, bars are stacked by color to distinguish offensive and defensive rebounds. The chart uses React with D3 v5 scales for positioning, renders as SVG, and displays a horizontal line at the mean value for the selected metric. Data comes from a GitHub-hosted CSV of the 2020-2021 season.

YYichen Li

93% match

Loading thumbnail…

Fork of NBA Player Games Played Bar Chart

This interactive bar chart displays games played by NBA players across all 30 teams, with a dropdown menu to select a team. Each bar represents a player, colored by wins (light green) versus losses (light coral), with a legend on the right. The React-based visualization uses D3 v5 scales and SVG rendering, with `scaleBand` for the x-axis player names, `scaleLinear` for the y-axis game counts, and the `csv` loader to fetch the NBA Player State dataset from a GitHub gist.

Rrmgoldberg24

90% match

Loading thumbnail…

Fork of NBA Player Games Played Bar Chart

This interactive bar chart visualizes the games played by NBA players for a selected team, using data from the NBA Player State Dataset. Users can choose a team from a dropdown menu, which updates the display to show each player's name on the x-axis and their total games played on the y-axis. The chart is rendered with React and SVG, using D3’s `scaleBand` and `scaleLinear` for axes, and includes a color legend differentiating wins from losses. Bars are colored light green, reflecting the "Wins" category.

VVamsiYandapalli

87% match

Loading thumbnail…

Fork of NBA Player Games Played Bar Chart

This visualization displays the number of games played by NBA players, allowing users to select a team from a dropdown menu to filter the data. Each bar represents a single player, with the x-axis showing abbreviated player names and the y-axis showing the count of games played. The chart is built using React and D3 v5, with the `csv` function loading the dataset and `scaleBand`, `scaleLinear`, and `scaleOrdinal` used for positioning and color encoding. Bars are rendered as SVG rectangles with a tooltip showing the exact game count, and a color legend uses light green to represent wins.

SSampras Dsouza

86% match

Loading thumbnail…

Untitled

This interactive bar chart displays games played by NBA players for a selected team, with a dropdown menu to switch between all 30 teams. Each bar represents a player, colored lightgreen, and the y-axis shows games played while the x-axis lists abbreviated player names. The visualization is built with React and rendered as SVG, using d3.scaleBand and d3.scaleLinear for scales, d3.csv for data loading, and ReactDropdown for team selection. Data comes from the NBA Player State Dataset, with player names shortened to first initial and last name initial format.

AAnne Lin

85% match

Loading thumbnail…

Fork of NBA Player Games Played Bar Chart

This interactive radar chart visualizes NBA player performance statistics—points, rebounds, assists, steals, blocks, and turnovers—for a selected team and player from a CSV dataset. Built with React and D3 v5, it uses d3.scaleLinear for each metric axis, positioned radially using trigonometric calculations, and renders SVG circles and paths with animation. Users select a team from a dropdown, then choose a player to display their statistical profile as a polygon overlay on the radar grid.

YYichen Li

85% match

Loading thumbnail…

Untitled

This interactive bar chart displays NBA team statistics for the 2021 regular season, with eight buttons letting viewers switch between metrics such as field goals made, assists, and rebounds. The visualization uses d3.csv to load data from a GitHub-hosted dataset and renders SVG line and circle marks, where each team’s value is shown as a point on a vertical baseline. The d3 scaleBand and scaleLinear axes update with smooth transitions on button clicks, changing the Y-axis domain to fit the selected statistic while coloring points by conference (Western or Eastern).

LLinhao Yu

84% match

Loading thumbnail…

NBAanalysis

This interactive bar chart displays the number of games played by players on selectable NBA teams. A dropdown menu chooses the team, and a color legend distinguishes wins from losses by shaded bars. The visualization is built with React and D3 v5, using `scaleBand` for the x-axis and `scaleLinear` for the y-axis. SVG rectangles render the data, which is parsed from a CSV URL using D3's `csv` function.

Yyc4004

84% match