Fork of Bar Chart

100%

Fork of Bar Chart

✓ Published0🌍 Public

Last edited Sep 15, 2022

Created on Sep 15, 2022

This fork of a bar chart shows the percentage of players who achieved a perfect, zero, or partial match for each named player in a PG-2021 matches dataset, sourced from a Gist hosted on GitHub. The visualization plots each player's name on the x-axis and the percentage values on the y-axis, using a D3 v7 SVG canvas. It leverages D3 APIs like `d3.scaleBand`, `d3.scaleLinear`, `d3.csv` for data ingestion, and `d3.axisBottom`/`d3.axisLeft` for axes, with bars styled via a `.bar` class.

AI-generated description

States with Stamen employees as of January 2022

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of D3 Scatter Plot

This fork of a D3 scatter plot visualizes a dataset of PG2021 matches, plotting each entry’s percentage of something matched against its name. The SVG chart uses `d3.scaleLinear` for both axes, with `d3.axisLeft` and `d3.axisBottom` to render tick labels, and circles are drawn via SVG `rect` elements (though named as circles). The data is loaded from a CSV file using `d3.csv`, and the layout adapts to the browser window’s inner dimensions.

TThaverman

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

73% match

Loading thumbnail…

stacked_bar_charts_golf

This stacked bar chart visualizes the percentage distribution of golf scores (from Condor to Triple bogey) across 51 players, with each bar sorted by total score. The chart uses D3.js v3 with ordinal and linear scales, rendering SVG rectangles for each score category. Color encoding distinguishes score types via a custom legend, while CSV data drives the visualization. Axes are drawn with d3.svg.axis, and player labels are rotated vertically for readability.

BBenHeubl

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

73% match

Loading thumbnail…

Fork of Simple Bar Chart

This example shows a line chart of year-one match wins plotted against results, with a steelblue line traced through the data. It loads a CSV dataset from a GitHub gist using d3.csv and d3.autoType, then renders an SVG with D3 v7. The chart uses d3.scaleLinear for both axes, d3.axisBottom and d3.axisLeft for ticks, and a d3.line generator to create the path. Axis labels are added via appended text elements.

Ppraveennayak1702@gmail.com

73% match

Loading thumbnail…

Fork of Let's make a Bar Graph with D3.js

This bar chart visualizes the scores of different teams using D3.js (v7) with SVG rendering. It loads CSV data from a GitHub gist and maps team names to the y-axis with a band scale, while a linear scale positions the bar widths based on score values. The code uses `d3.csv`, `scaleBand`, `scaleLinear`, and `axisLeft`/`axisBottom` to construct the chart, with red rectangles and styled text. Axes and margins frame the visualization, which updates dynamically after parsing and converting the numeric score data.

Ssaivinay143

73% match

Loading thumbnail…

Fork of Making a Bar Chart 3

This bar chart visualizes student test marks, with each bar’s length representing a score from 1 to 100. Built with D3 v5, it uses `d3.scaleLinear` for the x-axis, `d3.scaleBand` for categorical student labels, and `d3.axisBottom` with a custom tick formatter that abbreviates numbers. The SVG renders steel-blue rectangles, and the chart includes axis labels and a title. Data is loaded from a CSV and multiplied by 1,000 during preprocessing.

TtreasurehunterAP

72% match

Loading thumbnail…

Fork of dataset

This bar chart displays the total Test cricket runs scored by top batsmen, with names on the y-axis and runs on the x-axis. It uses D3.js v5 via UNPKG, employing `scaleLinear`, `scaleBand`, `axisLeft`, and `axisBottom` to construct the SVG visualization. The chart loads data from a local CSV file and customizes axis labels while removing default tick lines and domains for a cleaner appearance. The visualization highlights player rankings by bar length, with steelblue rectangles rendered from the parsed dataset.

Vvidhyanamini

71% match