HeroScore Top100 | Week 5

100%

HeroScore Top100 | Week 5

✓ Published0🌍 Public

Last edited Apr 26, 2015

Created on Apr 26, 2015

Scatterplot of the top 100 poker players’ HeroScore against their all-time earnings, sourced from a gist by CatLeal. The code uses D3.js v3, loading the CSV data with `d3.csv` and rendering SVG circles and axes. A sorting animation enlarges each point on a delay, and hovering highlights them. The visualization encodes each player’s name, country, and scores via tooltip titles, with logarithmic scaling on the y-axis.

AI-generated description

Similar vizzes

Loading thumbnail…

HeroScore Top100 | Week 4

This bar chart ranks the top 100 poker players by their total HeroScore, displaying each player's name on the y-axis and their score on the x-axis. A tooltip reveals a player's country and exact score. The visualization is rendered with SVG using D3 v3, and the data comes from a CSV file. The code uses `d3.scale.linear`, `d3.scale.ordinal`, `d3.svg.axis`, and `d3.csv` for scaling, axes, and data loading.

CCatLeal

93% match

Loading thumbnail…

HeroScore Top100 | Week 3

This example displays the top 100 poker players ranked by their HeroScore, a composite metric of influence and prestige, as horizontal bars. It uses the D3.js library (v3) to load data from a CSV file and render an SVG bar chart, where each bar’s width represents the player’s total HeroScore. Hovering over a bar reveals a tooltip with the player’s name, score, and country via the appended `title` element.

CCatLeal

91% match

Loading thumbnail…

HeroScore Top100 dataset

This chart visualizes the HeroScore Top100 dataset, comparing poker players across multiple performance metrics. Each row represents a player, with columns for earnings, popularity, poker results, and contribution scores. The code uses `d3.forceSimulation` to position nodes in a network graph, with node size mapped to total HeroScore and color indicating country. The underlying data comes from the CatLeal gist, parsed via `d3.csv` and rendered with `d3.geoPath` for the map background.

CCatLeal

87% match

Loading thumbnail…

Loading CSV Data with D3

This example displays a static SVG logo for HeroScore, a poker-related social influence rating, alongside a note that the top 100 players are available for exploration. The page loads a CSV file containing player statistics using D3’s `d3.csv` method, which parses the data into an array of JSON objects and logs them to the browser console for verification. The visualization itself relies on hardcoded SVG shapes—circles, a path, and text—rendered with D3 v3, and does not dynamically bind the CSV data to any visual elements.

CCatLeal

74% match

Loading thumbnail…

HeroScore Top100 | Week 3

A horizontal bar chart ranks 29 European countries by infant mortality rate in 2012. Using d3.csv to load the data and d3.ascending to sort by the a2012 field, it renders SVG rectangles whose widths encode each rate, with a title tooltip revealing the country and exact value. Bars are spaced ten pixels apart in a 1500-pixel-tall viewport.

CCatLeal

72% match

Loading thumbnail…

Gist 9e7f962de44840b48f6f27bcbe4d8cd8

This scatterplot-like visualization maps player names, positions, and scores from a team.csv dataset, encoding score on the y-axis and position on the x-axis. It uses d3.forceSimulation to position overlapping labels and nodes, with a d3.scalePoint for categorical positioning and d3.select to bind data. Each player is represented by a circle colored by position, with a text label showing their name and score. The chart renders in SVG via d3, with axes generated by d3.axisLeft and d3.axisBottom. The visualization highlights scoring distribution across positions, such as high-scoring back-rowers and fly-halves, without additional interactivity.

CConorAspell

65% match

Loading thumbnail…

Scatter Plot

A scatter plot displays the total earnings of the top six Dota 2 teams, encoding each team’s name on the y-axis and its earnings on the x-axis. Circles are sized to half the bandwidth of the categorical scale. Built with d3.csv, d3.scaleLinear, and d3.scaleBand, the chart uses axes created via d3.axisLeft and d3.axisBottom, and renders SVG circles with formatting via d3.format.

PPushkov Fedor

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

65% match