Olympic Swimming Project

100%

Olympic Swimming Project - 0.2

✓ Published1🌍 Public

Last edited Nov 8, 2024

Created on Nov 8, 2024

This interactive bar chart visualizes the number of gold medals won by the top 10 countries for a selected Olympic swimming event, using data from the Tokyo 2020 Olympics. Users can switch between events via a dropdown menu, which filters the dataset for gold medal winners and aggregates counts by country. The visualization uses D3's `scaleBand` and `scaleLinear` for axes, `scaleOrdinal` with `schemeCategory10` for bar colors, and employs the `xAxis` and `yAxis` helper components from `@curran/axis-labels` for labeling.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

olympic-swimming-project

This interactive visualization presents a bar chart that ranks the top 10 countries by the number of gold medals won in the 100-meter freestyle swimming event at the 2020 Tokyo Olympics. The chart displays each country along the x-axis and its corresponding gold medal count on the y-axis. The data comes from a CSV file containing Olympic swimming results. The visualization is built using D3.js, employing `scaleBand` for the categorical x-axis and `scaleLinear` for the numerical y-axis, with bar marks rendered as `rect` elements.

AAri Schechter

94% match

Loading thumbnail…

The Olympic Swimming Project visualization displays a bar chart showing the count of gold medal winners by country for the 100m freestyle event, with each bar colored distinctly. It processes Tokyo 2020 swimming data from a CSV file, filtering for rank 1 results, then aggregates and ranks the top ten countries. The chart is created using D3's scaleBand for the categorical x-axis, scaleLinear for the numeric y-axis, and scaleOrdinal for bar coloring, with axis labels added via the @curran/axis-labels library. The visualization highlights national dominance in a specific swimming discipline through an accessible, color-coded bar format.

AAri Schechter

93% match

Loading thumbnail…

Olympic Swimming Project - Final

This interactive bar chart explores Olympic swimming data from 1912 to 2020, showing the top 10 countries by gold medals for a selected event. Users choose an event from a dropdown menu, and the chart updates to display medal counts per country, with hover tooltips revealing each country’s fastest male and female swimmer. The visualization uses D3’s `scaleBand`, `scaleLinear`, and axis components, while an ordinal color scale assigns each country a unique color. Data comes from a CSV file sourced from Kaggle.

AAri Schechter

93% match

Loading thumbnail…

Fork of Olympic Swimming Project - 0.3

This interactive bar chart displays the number of gold medals won by the top ten countries for a selected Olympic swimming event. A dropdown menu lets users choose among events like 100m Freestyle or 200m Breaststroke, and the chart updates accordingly. The visualization uses d3's `scaleBand` and `scaleLinear` for axes, `select` for DOM manipulation, and bar marks with hover states that dim non-hovered bars. Data comes from the included CSV file containing medal results from the Tokyo 2020 Olympics.

AAri Schechter

92% match

Loading thumbnail…

Fork of Fork of Olympic Swimming Project - 0.4

This interactive bar chart displays the number of gold medals won by the top 10 countries in a selected Olympic swimming event, based on data from the 2020 Tokyo Olympics. Users can choose an event—such as a stroke, distance, or relay—via a dropdown menu, which updates the chart and its title. The visualization also includes a tooltip showing the fastest male and female swimmer for each country, along with their medal counts. Built with D3.js, the visualization uses `scaleBand` and `scaleLinear` for the chart layout, `scaleOrdinal` for color coding, and interactive details-on-demand tooltips.

AAri Schechter

92% match

Loading thumbnail…

Olympic Gold Medals by Sports

This bar chart visualizes Olympic gold medal counts across eight sports, showing swimming and javelin with the highest totals while running and cycling have the least. The visualization uses D3.js version 7.8.5, rendering SVG rect elements via a dynamic bar chart that adapts to container dimensions. SVG is selected with `d3.select`, while axes are generated using `scaleBand` for the categorical sports on the x-axis and `scaleLinear` for medal counts on the y-axis. The code implements `axisBottom` and `axisLeft` for scalable gridlines and labels.

Yyaredmtaye@gmail.com

80% match

Loading thumbnail…

Olympic Data stacked Bar Graph

This stacked bar chart displays Olympic medal counts by country, with each bar segmented into Gold, Silver, and Bronze using a D3 ordinal color scale. Hovering over the interactive side legend highlights the corresponding medal segment across all bars while dimming others. The visualization relies on D3's `flatRollup` and `stack` utilities for data aggregation and stacking, with axes generated by the `@curran/responsive-axes` library.

AAkanksha

78% match

Loading thumbnail…

Bar chart for the olympic medals

This bar chart shows the number of Olympic medals won by the top 10 countries, with countries on the y-axis and medal counts on the x-axis. The visualization uses D3 v5 with SVG rendering, employing `d3.scaleLinear` for the x-axis and `d3.scaleBand` for the categorical y-axis. Axes are customized using `d3.axisLeft` and `d3.axisBottom`, with grid lines and a custom tick format. Data is loaded asynchronously via `d3.csv` from a GitHub gist, and the chart includes axis labels and a title.

Aakhil kata

78% match