ICE-6 Scatter Plot

100%

ICE-6 Scatter Plot

✓ Published0🌍 Public

Last edited Mar 22, 2023

Created on Mar 22, 2023

This animated scatter plot visualizes Olympic medal data for top countries, showing the relationship between total medals and gold, silver, or bronze counts. The visualization cycles through different x-axis variables using a setInterval, dynamically updating the scatter plot and axis labels. Built with D3.js version 6.7.0, it uses SVG rendering with custom color-coded markers for USA, China, and Japan. The implementation leverages D3's csv loader, scaleLinear for axes, and custom circle attributes for elliptical data points.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

ICE-6 Scatter Plot

This scatter plot displays Olympic medal data, comparing each country’s total medals against its bronze medal count. Each circle’s fill color encodes the country (orange for USA, blue for China, green for Japan, black otherwise), while the circle’s `rx` and `ry` attributes visually encode gold and silver medal counts, respectively. Built with React and D3 v6, it loads CSV data, uses `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` for axes, and renders SVG circles via `select` and `.join`. The plot includes rotated axis labels for silver and gold medals.

BBhanuMotupalli

93% match

Loading thumbnail…

ICE7 - Scatter Plot

The visualization is an animated scatter plot of Olympic medal data, using D3.js to render colored, elliptical circles that represent countries by their gold, silver, bronze, and total medal counts. It cycles through different x-axis variables on a timer, updating the scales and axes dynamically. The plot uses D3's `csv` loader for data parsing, `scaleLinear` for axes, and custom SVG circles with hardcoded color mappings for USA, China, and Japan within a `setInterval` loop.

Aavinashchinta99

93% match

Loading thumbnail…

Reusable Scatter Plot

This interactive scatter plot visualizes Olympic medal data, mapping bronze medal counts against total medals while using circle size and color to indicate gold and silver medal tallies for the USA, China, and Japan. Built with React and D3, the visualization uses an animated `setInterval` to rotate through different x-axis columns, including total, silver, and bronze medals. The code leverages D3's `csv` loader, `scaleLinear`, `axisLeft`, and `axisBottom` APIs to render SVG circles and axes, with a custom legend and country-based color coding.

MManoj Kolluri

85% match

Loading thumbnail…

ICE6 - Avinash Chinta

This scatter plot visualizes Olympic medal counts by country, using the Data Canvas Sense Your City dataset. The visualization displays each country's total medals on the x-axis against its name on the y-axis, with individual data points rendered as circles. Built with React and D3 v5, the code implements d3.scaleTime for the x-axis and d3.scaleLinear for the y-axis, while SVG circles with tooltip titles show precise medal values on hover. The chart includes labeled axes and a distinct teal color scheme for data marks.

Aavinashchinta99

84% match

Loading thumbnail…

Scatter Plot

A scatter plot ranks the top ten countries by their all-time Olympic medal counts, with circles positioned along a linear scale for medal totals and a categorical axis for country names. The visualization uses D3 v5 APIs including `scaleLinear`, `scalePoint`, `axisLeft`, and `axisBottom` to construct the SVG chart, with data loaded from a CSV file. Grid lines extend across the plotting area, and the title highlights the dataset's focus on Olympic medal hauls.

Ssriramvsharma

82% match

Loading thumbnail…

Scatter Plot

Ssriramvsharma

82% match

Loading thumbnail…

Fork of Fork of ICE-6 Scatter Plot

This visualization displays a scatter plot of Commonwealth Games data, with each circle representing a country positioned by its first and second place finishing counts. The circles are colored by country—red for the USA, yellow for China, green for Japan, and black for others—with a sky-blue background. The code loads a German Credit CSV dataset, though the visualization appears to plot sports performance metrics, using D3 v6’s `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs. It renders as an SVG with circle elements, axis labels, and custom tick font styling.

Cchandanagandla

81% match

Loading thumbnail…

ICE6 - Avinash Chinta

This visualization displays Olympic medal data for multiple countries, plotting each nation as a circle based on its total medals and bronze medal count. The color and size of each circle vary according to the country’s gold and silver medal tallies. Built with React and D3 v6, the code uses `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load and scale data from a GitHub-hosted CSV, then renders the result as SVG circles with labels.

Aavinashchinta99

81% match