Doping in Professional Bicycle Racing

100%

Doping in Professional Bicycle Racing

✓ Published1🌍 Public

Last edited Jan 5, 2020

Created on Jan 4, 2020

This scatter plot visualizes doping allegations in professional bicycle racing, with each circle representing a rider’s race time (y-axis) plotted against the year (x-axis). The color distinguishes riders with doping allegations from those without, and a tooltip reveals the rider’s name, nationality, year, time, and doping details on hover. Built with D3 v5, it uses `scaleLinear` for axes, `axisBottom` and `axisLeft` for ticks, `scaleOrdinal` with `schemeCategory10` for colors, and `timeFormat` for time labels. Data comes from a FreeCodeCamp JSON file, rendered as SVG with a custom legend and tooltip.

AI-generated description

This scatter plot shows data about cars, from UCI Machine Learning Repository: Auto MPG Data Set.

MIT Licensed

Similar vizzes

Loading thumbnail…

Scatter Plot

This scatter plot visualizes doping allegations in professional bicycle racing, plotting race times (in minutes) against years for individual riders. Each circle represents a rider, color-coded to distinguish those with doping allegations from those without, with a legend clarifying the categories. The visualization uses D3 v5 with SVG rendering, employing `scaleLinear` for the x-axis, `scaleTime` for time-based y-values, and `scaleOrdinal` with `schemeCategory10` for colors. Interactive tooltips appear on mouseover, showing rider details using D3 events. Data comes from freeCodeCamp’s cyclist-data.json dataset, with parsed time strings converted to Date objects for accurate axis formatting.

VVansh1019

95% match

Loading thumbnail…

Doping In Cycling, ICE-7

This scatter plot visualizes doping in professional bicycle racing, showing each rider’s finish time against the race year, with circles colored by whether doping allegations exist. It uses D3 v5 with SVG rendering, employing `d3.scaleLinear` for axes, `d3.scaleOrdinal` and `schemeCategory10` for color encoding, and a custom tooltip on mouseover. Data comes from a CSV loaded via `d3.csv`, with times parsed into date objects using `d3.timeFormat`. Axis ticks include gridlines, and a legend distinguishes allegations from clean riders.

HHarshinireddyy19

92% match

Loading thumbnail…

Scatter Plot with Color Legend

This scatter plot visualizes 35 fastest times up Alpe d'Huez in professional bicycle racing, plotting year against race time in minutes and coloring each dot to indicate whether the rider faced doping allegations. The chart uses d3.scaleLinear for the x-axis, d3.scaleTime for the y-axis, and d3.scaleOrdinal with d3.schemeCategory10 for color encoding. An interactive tooltip displays rider details, nationality, year, time, and doping information on hover. The visualization renders as SVG, using React 16 and D3 v5 to load data from a JSON file and generate axes with d3.axisBottom and d3.axisLeft.

Vvaynexie

90% match

Loading thumbnail…

Clickable Tooltip

This interactive scatter plot visualizes doping allegations in professional bike racing from 1994 to 2015, plotting race times against years. Built with D3 v7, it fetches cyclist data from a Free Code Camp GitHub repository and renders SVG circles with jitter to reduce overplotting. Hovering reveals a clickable tooltip with rider details and source links, while color-coded dots and a legend distinguish riders with and without doping allegations. Tooltip transitions use D3’s `.transition()` for smooth fade-in/out effects.

Aadventuresenglish.info@gmail.com

88% match

Loading thumbnail…

fcc-d3-02

This example visualizes doping allegations among the 35 fastest recorded times up Alpe d’Huez, plotting each cyclist’s year against their finishing time. Blue and red dots distinguish riders without and with doping allegations, with a legend and axis labels. The interactive tooltip reveals the rider’s name, nationality, year, time, and doping details on hover. Built with React and D3 v7, it uses `scaleLinear`, `scaleOrdinal`, and `extent` to map data from a freeCodeCamp JSON source, rendering SVG circles and handling mouse events via `select` and `append`.

SSiddharthMittal07

87% match

Loading thumbnail…

Visualize Data with a Scatterplot Graph | fcc project-2

This scatterplot graphs 35 fastest times up Alpe d'Huez, with orange and blue circles distinguishing riders with and without doping allegations. The visualization uses d3.scaleLinear for both axes, parsing race times into Date objects for the y-axis. Built with React and d3.v7, it renders SVG circles that trigger an HTML tooltip on mouse hover, displaying rider details from the freeCodeCamp cyclist-data.json dataset. A legend clarifies the color coding for doping status.

MMohammed Banani | MbDev

87% match

Loading thumbnail…

fCC D3 Project #2: Scatterplot Graph

This scatterplot visualizes the performance of professional cyclists, plotting race times against years. The time to complete the course is mapped on the y-axis using a time scale, while the x-axis uses a linear scale for the year. The graph distinguishes between riders with doping allegations in blue and those without in red, and includes a legend for clarity. Data is fetched from the freeCodeCamp cyclist-data.json. The visualization is built with D3.js (version 7.9.0), using the `scaleTime` and `scaleLinear` APIs, and renders an SVG with tooltips that display rider details on hover.

CCasualWanderer20XX

85% match

Loading thumbnail…

Fork of Question 3 scattered plot

A scatter plot displays the fastest recorded times for professional cyclists, with each dot representing a rider’s year and finishing time. Red dots indicate doping allegations, green dots indicate no doping, and hovering reveals a tooltip with the rider’s name, nationality, and details. Built with D3 v5 and Vue, the visualization uses `d3.scaleLinear` for the x-axis, `d3.scaleTime` for the y-axis, and `d3.axisBottom` and `d3.axisLeft` for tick generation. Data is loaded via `d3.json` from the freeCodeCamp cyclist-data dataset.

Nneeleshalapati@gmail.com

84% match