Interactive lap chart visualization of Formula 1 races. The application is hosted here.
This project is based on the lap chart designed by Chris Pudney. Chris used a custom JSON for a single race. I developed a backend service that is able to automatically generate the JSON needed to draw the chart for any race starting from the 2011 season.
I have used Angular JS for the frontend and Express JS for the backend. I retrieve the race results from the Ergast web service using this Ergast client for NodeJS.
- You need to have Node.js installed.
- Go to the
backenddirectory and executenpm install. - You need to have the race results stored in /backend/data. I have included an application that retrieves
the data automatically. It is under /backend/races_updater/updater.js. To execute it, simply go to that directory and
run
node updater.js -h. That will output the instructions to run the program. - Start the service with
npm start.
You need to use an HTTP Server. For example, you can execute python -m SimpleHTTPServer 9999 in the
frontend directory.
The webapp will be available in http://localhost:9999. You can choose a different port.
If you modified the address or the port of the backend service, you will need to change the BASE_URL constant in /frontend/app/configuration.js
There are at least a couple of races that are not visualized correctly:
- The 11th race of 2014.
- The 18th race of 2014.
Creative Commons. Attribution-ShareAlike 3.0 Unported (CC BY-SA 3.0)