This project is a visual representation of cycling data using a scatterplot graph. The scatterplot graph is a type of plot using Cartesian coordinates to display values for two variables from a set of data. This project is built with D3.js, a JavaScript library for producing dynamic and interactive data visualizations in web browsers.
The dataset used in this project is a JSON file from freeCodeCamp that provides information about different cyclists, including the year, time, and any doping allegations.
To run this project locally, you can clone the repository and open the index.html file in your browser.
index.html: This file includes the HTML structure of the project and links to the required D3.js library.style.css: This file contains all the CSS styles used in the project.index.js: This file contains the JavaScript and D3.js code to fetch the data, create scales, draw the scatterplot graph, and generate the axes.
- The scatterplot graph shows performance times of various cyclists and differentiates between cyclists with and without doping allegations.
- When the mouse hovers over a point in the graph, a tooltip appears showing more information about the cyclist.
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.