SimpleBar

100%

✓ Published0🌍 Public

Last edited Aug 29, 2018

Created on Aug 29, 2018

This bar chart displays the total distance covered by Arsenal players in a single match, sorted in descending order from Ramsey’s 12,134.88 meters to Welbeck’s 2,137.31 meters. It loads data from Physical.csv using d3.csv, then uses d3.scaleBand for the x-axis, d3.scaleLinear for the y-axis, and d3.axisBottom and d3.axisLeft for the axes. Rectangles are appended with a steelblue fill, and the bars’ heights are computed from the data values using the height minus y scale.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot PL xG Data

This scatter plot shows Arsenal’s points and expected points (xP) per matchweek across a Premier League season. A single SVG canvas displays two overlaid linear scales mapping matchweek to points and xP, with axes labeled accordingly. The code uses D3 v7 primitives like `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` from the `axes` module. Data is loaded via `csvParse` from a raw GitHub CSV, filtered for Arsenal, and rendered as circles using `selectAll('circle').join()`. The visualization clarifies how actual results compare to underlying performance metrics.

MMatthew Dzwil

68% match

Loading thumbnail…

Gist 0ff68c82fce6408905fe7964eaf25be3

The visualization ranks ten Premier League midfielders by their current fantasy football weight, mapping each player’s name to a horizontal bar chart. It shows relative player value through bar length, with heavier weights (e.g., Harrison at 27.5) extending farther than lighter ones (e.g., Walcott at 21.5). The code uses D3.js’s `scaleBand` and `scaleLinear` to position and size the bars, while `d3.select` and `attr` methods bind the CSV data from `player_in_weights.csv` to SVG rectangles. Player names and weights are appended as text labels using `text` and `attr` calls, with the chart’s axes and gridlines drawn via `d3.axisBottom` and `d3.axisLeft`.

CConorAspell

68% match

Loading thumbnail…

English Premier League Visualization - Interactive

This interactive line chart tracks the weekly point totals of Arsenal and Tottenham in the 2003-04 English Premier League season, sourced from a football CSV dataset. Two SVG paths represent each team’s cumulative points across 38 weeks, with Arsenal in red and Tottenham in blue. Hovering over a line triggers a D3 event that increases its stroke width to emphasize the selected team, while the chart resizes responsively to the window. The visualization uses D3 v4’s `d3.select` and `d3.line` APIs, with axes scaled via `d3.scaleLinear`.

RRainismZ

67% match

Loading thumbnail…

Bar Chart: Man of the Match Awards

This bar chart visualizes the total Man of the Match awards won by soccer players since the 2009/10 season. Using D3 v3 and v4 loaded together, it renders an SVG bar chart with a green fill for each player, animating bar heights upward with staggered delays. The chart includes rotated axis labels, a y-axis title, and is overlaid with a football pitch outline, penalty areas, a halfway line, and a center circle drawn using D3 scales for field coordinates.

SSimon Hackbert

67% match

Loading thumbnail…

Shotmappingtest

A scatterplot of Arsenal shots maps each attempt by pitch coordinates, with circle size scaled to expected goals (xG) via `d3.scaleSqrt` and color indicating goals (red) versus non-goals (grey). Hovering triggers a `transition` that triples the radius, while a `title` tooltip reveals player, team, xG, and match details. The SVG uses a rotated soccer-field background image and loads player data from ArsenalShots.csv, leveraging `d3.csv` and linear scales for positioning.

TTollyCoburn

67% match

Loading thumbnail…

Bar Chart

This bar chart visualizes the most goals scored by professional footballers, with player names on the y-axis and goal counts on the x-axis. The code uses d3.csv to load the data, d3.scaleLinear and d3.scaleBand for the axes, and d3.axisBottom with tick formatting. Purple rectangles are rendered in SVG, and the chart includes a title and axis label.

RRashesh4

66% match

Loading thumbnail…

A4 - Bar

This bar chart visualizes the average expected goals (xG) for English Premier League teams, comparing home versus away matches. The data is loaded from a CSV file and processed using `d3.csv` and `d3.mean`. The visualization uses `d3.scaleLinear` and `d3.scaleBand` to map values, with bars rendered as SVG rectangles. A title and axes are added using `d3.axisLeft` and `d3.axisBottom`. The bars animate a color transition from steelblue to red using `transition`, while the page includes a video tutorial link. The rendering is SVG-based with dynamic interactivity.

RRavneet Singh Bhatia

66% match

Loading thumbnail…

English Premier League Visualization

This line chart compares the weekly league points of Arsenal and Tottenham across the 38-game 2003-04 English Premier League season, highlighting Arsenal’s unbeaten run and their final 90-point tally against Tottenham’s 45. The graphic renders two distinct lines in red and steelblue, using d3.csv to load the precomputed weekly standings and d3.scaleLinear to map week numbers and points to the SVG canvas. The code builds paths with d3.line, applies axes via d3.axisBottom and d3.axisLeft, and styles the strokes in CSS, with the data sourced from a GitHub CSV.

RRainismZ

66% match