Fork of company List

100%

Fork of company List

✓ Published1🌍 Public

Last edited Jun 24, 2022

Created on Jun 24, 2022

This visualization displays sports-related data from a CSV file as a horizontal bar chart, ranking the top 11 entries by their 2021 match counts. The chart uses React for component-based rendering and D3 v5 for data loading and scale construction. Specifically, it employs `d3.csv` for data fetching, `scaleBand` for the categorical y-axis, and `scaleLinear` for the numeric x-axis. The SVG rectangles are colored purple and rendered directly within a React component, with axes and tick labels generated manually using D3's scale methods.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

Similar vizzes

Loading thumbnail…

Fork of company List

This example visualizes the most famous sports of 2021 using a horizontal bar chart. The chart displays the number of matches for each sport, with sports ordered alphabetically along the vertical axis and match counts on the horizontal axis. The code uses D3 v5 utilities like scaleBand, scaleLinear, and max to create the scales, while CSV data is loaded via d3.csv. The visualization is rendered as SVG elements within a React component using the react and react-dom libraries, with purple bars representing each sport's match count.

NNaimisha-M

92% match

Loading thumbnail…

Fork of Fork of Fork of Sports List

A horizontal bar chart displays the popularity of sports in 2021, ranking eleven sports by match count. The visualization uses React with D3.js v5, loading data from a CSV file and rendering the chart as an SVG. D3's `csv` function parses the data, while `scaleBand` and `scaleLinear` position bars and axes. The bars themselves are SVG rectangles filled with purple, and the chart includes axis ticks and labels generated with D3's `scaleLinear` and `scaleBand` methods.

NNaimisha-M

91% match

Loading thumbnail…

Fork of company list

This bar chart displays the top 11 companies from a CSV dataset, ranked by their “2021” matches, with a main title “Famous Sports in 2021.” Built with React and D3, it uses `scaleBand` for the categorical y-axis and `scaleLinear` for the quantitative x-axis, rendering the bars as SVG `rect` elements with a purple fill.

NNaimisha-M

90% match

Loading thumbnail…

Fork of Fork of company list

A bar chart displays the top 11 rows from a CSV of company data, plotting each company’s "Serial_Number" as a purple horizontal bar against its "Leave" label on the y-axis. The React app fetches the data via D3’s `csv` function, then uses D3’s `scaleBand` and `scaleLinear` for axes, with `d3.max` to scale the x-axis. SVG rendering is handled through React’s `ReactDOM.render`, producing tick marks, labels, and the bars themselves. The chart’s title, "Famous Sports in 2021," appears as an HTML heading.

NNaimisha-M

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

90% match

Loading thumbnail…

Fork list

A horizontal bar chart displays the popularity of eleven sports in 2021, with purple bars representing match counts on a blue grid. The visualization loads data from a CSV file using `d3.csv` and renders an SVG via React. It employs `scaleBand` for the categorical y-axis and `scaleLinear` for the quantitative x-axis, with `d3.max` determining the domain, while axis ticks are manually generated from the scales.

Ppavan0828

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

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

88% match