{"id":16986867,"url":"https://github.com/mgschoen/driverless-cockpit","last_synced_at":"2026-04-09T02:03:36.010Z","repository":{"id":257825230,"uuid":"773949591","full_name":"mgschoen/driverless-cockpit","owner":"mgschoen","description":"Real-time data-visualizations for a self-driving racing car","archived":false,"fork":false,"pushed_at":"2024-04-05T09:48:48.000Z","size":3402,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-01-26T20:12:45.648Z","etag":null,"topics":["autonomous-driving","canvas","data-visualization","formula-student","formula-student-driverless","konvajs","racing-car","real-time","visualization","vuejs"],"latest_commit_sha":null,"homepage":"https://driverless-cockpit.onrender.com/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mgschoen.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-03-18T17:19:16.000Z","updated_at":"2024-04-05T09:51:00.000Z","dependencies_parsed_at":"2024-10-14T02:47:11.991Z","dependency_job_id":"135cc18f-cdfd-47a5-8e9b-3711d75db68f","html_url":"https://github.com/mgschoen/driverless-cockpit","commit_stats":null,"previous_names":["mgschoen/driverless-cockpit"],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mgschoen%2Fdriverless-cockpit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mgschoen%2Fdriverless-cockpit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mgschoen%2Fdriverless-cockpit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mgschoen%2Fdriverless-cockpit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mgschoen","download_url":"https://codeload.github.com/mgschoen/driverless-cockpit/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":244894322,"owners_count":20527677,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["autonomous-driving","canvas","data-visualization","formula-student","formula-student-driverless","konvajs","racing-car","real-time","visualization","vuejs"],"created_at":"2024-10-14T02:47:08.580Z","updated_at":"2025-12-30T22:12:43.458Z","avatar_url":"https://github.com/mgschoen.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Driverless Cockpit\n\nWeb-based real-time data-visualizations for a self-driving racing car.\n\n![](./driverless-cockpit.png)\n\nThis webapp was used by UAS Munich's motorsport team [munichmotorsport](https://munichmotorsport.de/) during the 2018 season of [Formula Student](https://www.global-formula-racing.com/en/formula-student/) to monitor, debug and refine their driverless car.\n\nThe app visualizes position, rotation, steering angle, acceleration, speed and many other internal parameters of the car both in real-time and retrospectively. It also displays track boundaries recognized by the car's camera-based recognition system.\n\n**[View demo app here.](https://driverless-cockpit.onrender.com/)**\n\n## Stack\n\n- NodeJS\n- Express\n- MongoDB\n- VueJS\n- Vuex\n- Bootstrap\n- KonvaJS\n- Apache Echarts\n\n## Architecture\n\nThe app consists of a NodeJS backend and a VueJS web application.\n\nThe backend accepts TCP Messages from the car. Each message represents one discrete snapshot of the vehicle's internal state. TCP Messages are converted to JSON, optionally stored in MongoDB, and provided to the client via an HTTP API.\n\nThe Vue app fetches its data either periodically to represent real-time state, or chunked to display a recorded sequence of data. The car's location, orientation and surroundings are visualized on a 2D canvas using [KonvaJS](https://konvajs.org/index.html). Changes to single parameters over time are drawn as line charts with [Apache Echarts](https://echarts.apache.org/en/index.html).\n\n## Usage\n\nThis monorepo contains the client application and a simplified version of the backend for public use. Instead of connecting to a real vehicle, this demo backend reads [mocked messages from a local CSV](https://github.com/mgschoen/driverless-cockpit/tree/main/api/data).\n\n### Prerequisites:\n\n- NodeJS 20.12 installed on your machine\n\n### Install\n\nClone this repo. In your terminal, navigate to the repo's root folder and run\n\n```sh\nnpm install\n```\n\n### Local development\n\nThe following command starts both the backend and a webpack-dev-server with the client app:\n\n```sh\nnpm run dev\n```\n\nWebpack will auto-open the app in the browser and output the URL in your terminal. Usually, the URL is [`http://localhost:8080`](http://localhost:8080).\n\n### Backend-only\n\nTo start just the backend, execute\n\n```sh\nnpm run api:start\n```\n\n### Client-only\n\nTo start just the dev-server without the backend, run\n\n```sh\nnpm run frontend:dev\n```\n\nBuild the app for production:\n\n```sh\nnpm run frontend:build\n```\n\nBoth commands respect the environment variable `API_ROOT` to overwrite the default API URL. Use this e.g. to develop against the deployed backend at `https://driverless-cockpit-demobackend.onrender.com/`. The default `API_ROOT` is `http://localhost:3000/`.\n\nExample:\n\n```sh\n# use deployed public API\nAPI_ROOT=https://driverless-cockpit-demobackend.onrender.com/ npm run frontend:dev\n```\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmgschoen%2Fdriverless-cockpit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmgschoen%2Fdriverless-cockpit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmgschoen%2Fdriverless-cockpit/lists"}