Skip to main content
SimilarExport ZIP
100%

Most Popular Sports Ranked By Total Fans

✓ Published0🌍 Public
Llingjizhu@gmail.com
Last edited Jan 23, 2024
Created on Jan 20, 2024
Forked from Solar System

This animated bar chart ranks the top five most popular sports worldwide by total fan base, using circle areas to represent fan counts. Soccer leads with 3.5 billion fans, followed by cricket, hockey, tennis, and volleyball. The visualization loads circles from the bottom and labels fade in sequentially, using D3.js transitions with easing functions. The code leverages `d3.select`, `transition`, and `easeLinear` to animate circle radii and label opacity, with data sourced from World Atlas.

AI-generated description

Data from World Atlas: The Most Popular Sports In The World.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Sports List

This visualization displays the top 10 famous sports in 2021, with each sport's popularity measured by the number of matches played. The horizontal bar chart renders as an SVG using React and d3.js, with the data loaded from a CSV file via d3.csv. The chart uses d3.scaleBand for the y-axis sport categories, d3.scaleLinear for the x-axis match counts, and d3.max to compute the scale domain. The code also utilizes React's useEffect and useState hooks for fetching and storing the data.

NNaimisha-M
73% match
Loading thumbnail…

Sports List

This visualization displays a bar chart of the top eleven sports in 2021 based on match counts, sorted vertically with a purple bar for each sport. The code uses D3 v5 (including `scaleBand`, `scaleLinear`, `csv`, and `max`) within a React component to load data from a GitHub-hosted CSV and render the chart as an SVG. Axes are manually drawn with ticks and gridlines, while text labels for sports appear on the left.

MManasaPatange
72% match
Loading thumbnail…

Fork of Sports List

This example displays the 11 most popular sports of 2021 ranked by number of matches, rendered as a horizontal bar chart using SVG. The chart uses React with hooks to load and manage the CSV data, while D3 v5 provides the scales, axes, and shape rendering. The bars are colored purple and include labeled tick marks for both axes, with the x-axis scaled linearly by match count. The code uses `scaleBand` for the categorical sports names and `scaleLinear` for the numeric values.

NNaimisha-M
72% match
Loading thumbnail…

data

This visualization displays the top 11 popular sports in 2021 as a horizontal bar chart, using a purple bar for each sport whose length corresponds to the number of matches played that year. The chart loads data from a CSV file using `d3.csv` and renders SVG elements through React components. It uses `d3.scaleBand` for the categorical y-axis, `d3.scaleLinear` for the quantitative x-axis, and custom tick rendering for both axes. The page includes a title and uses React hooks like `useState` and `useEffect` to manage data loading.

SSaiSree0122
71% match
Loading thumbnail…

Fork of Sports List

This visualization presents a bar chart of the most famous sports in 2021, using horizontal bars ordered by rank to display the number of matches for each sport. It loads data from a CSV file via `d3.csv` and renders the chart with React, using `scaleBand` for the categorical y-axis and `scaleLinear` for the numeric x-axis. The SVG output includes grid lines and axis tick labels generated by D3’s scale methods, with bars filled in purple.

NNaimisha-M
71% match
Loading thumbnail…

Fork of Fork of Fork of Fork of Sports List

This visualization presents a ranked bar chart of popular sports in 2021, sourced from a CSV dataset and rendered as an SVG via React. The code uses d3.csv for data loading, d3.scaleBand and d3.scaleLinear for positioning, and d3.max for domain calculation. Horizontal bars display each sport’s match count, with axis ticks and labels generated manually using d3.ticks. The chart is built with React hooks (useState, useEffect) and ReactDOM rendering, with D3 selections integrated for scaling and formatting.

NNaimisha-M
71% match
Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of Sports List

This visualization displays the popularity of sports in 2021 using horizontal purple bars. The chart ranks the top 11 sports based on match counts, with a blue gridline background and labeled axes. Built with React and D3 v5, it uses `d3.csv` to load data from a GitHub gist, `scaleBand` for the y-axis, and `scaleLinear` for the x-axis, rendering all elements as SVG rectangles.

SSaiSree0122
70% match
Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of Sports List

A horizontal bar chart displays the popularity of sports in 2021, ranking eleven sports by match counts from a CSV dataset. The visualization uses React with D3 v5, employing `d3.csv`, `scaleBand`, and `scaleLinear` to map data to SVG rectangles. Purple bars represent match totals, with axes drawn using `xScale.ticks()` and manual tick text. The chart renders client-side, fetching data from a GitHub gist URL.

SSaiSree0122
70% match