{"id":18262957,"url":"https://github.com/betaflight/blackbox-log-viewer","last_synced_at":"2025-05-15T09:09:18.834Z","repository":{"id":37270319,"uuid":"55149905","full_name":"betaflight/blackbox-log-viewer","owner":"betaflight","description":"Interactive log viewer for flight logs recorded with blackbox","archived":false,"fork":false,"pushed_at":"2025-05-10T20:25:42.000Z","size":169100,"stargazers_count":466,"open_issues_count":21,"forks_count":152,"subscribers_count":34,"default_branch":"master","last_synced_at":"2025-05-10T21:28:53.027Z","etag":null,"topics":["betaflight","hacktoberfest"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/betaflight.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":"CODE_OF_CONDUCT.md","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,"zenodo":null},"funding":{"custom":"https://paypal.me/betaflight","patreon":"betaflight"}},"created_at":"2016-03-31T12:46:19.000Z","updated_at":"2025-05-10T20:25:45.000Z","dependencies_parsed_at":"2023-12-09T02:26:41.604Z","dependency_job_id":"27b5e9af-25f3-455b-8fe4-bfdf80eaa263","html_url":"https://github.com/betaflight/blackbox-log-viewer","commit_stats":null,"previous_names":[],"tags_count":53,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/betaflight%2Fblackbox-log-viewer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/betaflight%2Fblackbox-log-viewer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/betaflight%2Fblackbox-log-viewer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/betaflight%2Fblackbox-log-viewer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/betaflight","download_url":"https://codeload.github.com/betaflight/blackbox-log-viewer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254310520,"owners_count":22049470,"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":["betaflight","hacktoberfest"],"created_at":"2024-11-05T11:09:23.008Z","updated_at":"2025-05-15T09:09:13.809Z","avatar_url":"https://github.com/betaflight.png","language":"JavaScript","funding_links":["https://paypal.me/betaflight","https://patreon.com/betaflight"],"categories":[],"sub_categories":[],"readme":"# Betaflight Blackbox Explorer\n\n[![Latest version](https://img.shields.io/github/v/release/betaflight/blackbox-log-viewer)](https://github.com/betaflight/blackbox-log-viewer/releases)\n[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=betaflight_blackbox-log-viewer\u0026metric=alert_status)](https://sonarcloud.io/dashboard?id=betaflight_blackbox-log-viewer)\n[![License: GPL v3](https://img.shields.io/badge/License-GPLv3-blue.svg)](https://www.gnu.org/licenses/gpl-3.0)\n\n![Main explorer interface](screenshots/main-interface.jpg)\n\nThis tool allows you to open logs recorded by Betaflight's Blackbox feature in\nyour web browser. You can seek through the log to examine graphed values at each\ntimestep. If you have a flight video, you can load that in as well and it'll be\nplayed behind the log. You can export the graphs as a WebM video to share with\nothers.\n\n## Installation\n\nCurrent blackbox explorer version is built as\n[PWA](https://developer.mozilla.org/en-US/docs/Web/Progressive_web_apps/Guides/What_is_a_progressive_web_app).\nMeaning it can work in both online and offline modes as regular desktop app\nwould.\n\n### Latest stable version\n\nFor the latest stable released version visit https://blackbox.betaflight.com/\n\n### Unstable testing versions\n\nThe latest master build is always available at https://master.dev.blackbox.betaflight.com/\n\n**Be aware that these versions are intended for testing / feedback only, and may be buggy or broken. Caution is advised when using these versions.**\n\n### Install the app to be used in offline mode\n\nFollow the procedure to install PWA on your platform. For example on MacOS chrome:\n![Url bar PWA install](screenshots/url-bar.webp)\n![PWA install dialog](screenshots/pwa-install-dialog.webp)\n\n## Usage\n\nClick the \"Open log file/video\" button at the top right and select your log file\nand your flight video (if you recorded one).\n\nYou can scroll through the log by clicking or dragging on the seek bar that\nappears underneath the main graph. The current time is represented by the\nvertical red bar in the center of the graph. You can also click and drag left\nand right on the graph area to scrub backwards and forwards.\n\n### Syncing your log to your flight video\n\nThe blackbox plays a short beep on the buzzer when arming, and this corresponds\nwith the start of the logged data.  You can sync your log against your flight\nvideo by pressing the \"start log here\" button when you hear the beep in the\nvideo. You can tune the alignment of the log manually by pressing the nudge left\nand nudge right buttons in the log sync section, or by editing the value in the\n\"log sync\" box. Positive values move the log toward the end of the video,\nnegative values move it towards the beginning.\n\n### Customizing the graph display\n\nClick the \"Graph Setup\" button on the right side of the display in order to\nchoose which fields should be plotted on the graph. You may, for example, want\nto remove the default gyro plot and add separate gyro plots for each rotation\naxis.  Or you may want to plot vbat against throttle to examine your battery's\nperformance.\n\n## Developing\n\n### Node setup\n\nWe are using [nvm](https://github.com/nvm-sh/nvm) to manage the correct node\nvesion, follow the install instructions there. After which from blackbox directory\njust run:\n\n```bash\nnvm use\n```\n\n### Yarn\n\nFor dependency management we are using [yarn](https://yarnpkg.com/), follow the\ninstructions there to install it.\n\n### Development mode\n\nWe are using [vite](https://vitejs.dev/) for development setup. It provides\nbundling and various optimisations like hot module reloading.\n\nWith `node` and `yarn` setup, to start developing run:\n\n```bash\nyarn start\n```\n\nThis will start development server and the Blackbox will be available on http://localhost:5173/.\n\n### Installing development build locally\n\nIf you want to have latest and greatest version installed on your machine from\nthe tip of the repository:\n\nFirst need to build the application:\n```bash\nyarn build\n```\nThen start the application in `preview` mode\n```bash\nyarn preview\n```\nVisit http://localhost:4173/ and follow the steps from [Install the app to be used in offline mode](#install-the-app-to-be-used-in-offline-mode)\n\n## Common problems\n\n### Flight video won't load, or jumpy flight video upon export\n\nSome flight video formats aren't supported by Chrome, so the viewer can't open\nthem. You can fix this by re-encoding your video using the free tool\n[Handbrake][]. Open your original video using Handbrake. In the output settings,\nchoose MP4 as the format, and H.264 as the video codec.\n\nBecause of [Google Bug #66631][], Chrome is unable to accurately seek within\nH.264 videos that use B-frames. This is mostly fine when viewing the flight\nvideo inside Blackbox Explorer. However, if you use the \"export video\" feature,\nthis bug will cause the flight video in the background of the exported video to\noccasionally jump backwards in time for a couple of frames, causing a very\nglitchy appearance.\n\nTo fix that issue, you need to tell Handbrake to render every frame as an\nintraframe, which will avoid any problematic B-frames. Do that by adding\n\"keyint=1\" into the Additional Options box:\n\n![Handbrake settings](screenshots/handbrake.png)\n\nHit start to begin re-encoding your video. Once it finishes, you should be able\nto load the new video into the Blackbox Explorer.\n\n[Handbrake]: https://handbrake.fr/\n[Google Bug #66631]: http://code.google.com/p/chromium/issues/detail?id=66631\n\n## License\n\nThis project is licensed under GPLv3.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbetaflight%2Fblackbox-log-viewer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbetaflight%2Fblackbox-log-viewer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbetaflight%2Fblackbox-log-viewer/lists"}