BioSignal Web Recorder is an application based on Web Serial connection, you can connect boards like Arduino Uno, Arduino Nano after uploading the ArduinoFirmware.ino code to it, you'll recieve data signals from the board which can be visualized on web using BioSignal Web Recorder. Users can visualize ECG and EMG signals.
- Connection: Experience a smooth connection/disconnection with board in single click.
- Real-time Visualization: Visualize incoming data without any jitter from the board in real-time on SmoothieCharts.
- Recording: Record the signals data in csv files, multiple instances can be recorded and downloaded as zip of csv's.
- Bi Directional Communication: We can also write data in the board, the table below shows what we recieve if sent data is:
| Sent Data | Data Received | Value |
|---|---|---|
| 'c' | Channel Count | 6 |
| 'n' | Board Name | "Arduino" |
| 's' | Sampling Rate | {125, 250, 500, 1000} |
| 'r' | Resolution | 10 |
| Feature | Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Safari iOS | Samsung Internet | WebView Android |
|---|---|---|---|---|---|---|---|---|---|---|
| ✅ | ✅ | ✅ | ❌ | ✅ | ❌ | ❌ | ❌ | ❌ | ❌ | ❌ |
- Connect the Arduino to your computer using a USB cable.
- Open the Arduino IDE and flash the provided firmware onto the Arduino.
- Open the BioSignal-Recorder-Web in a web browser.
- Click the "Connect" button to establish a connection with the Arduino and stream.
- Click the "Record" button to record data. Record multiple data and download as zip, or single recording as csv.
- To download the recorded data, click the "download" button.
- Next js: A framework build on top of React.js.
- TypeScript: Statically typed superset of JavaScript.
- Tailwind CSS: Utility-first CSS framework.
- Shadcn UI: Provides Reusable and customizable components, built with radix UI.
- Lodash: Utility library for data manipulation, used for data throttling.
- JSZip: Library for creating and manipulating ZIP files, used for save recordings as ZIP.
- Smoothie Js: Real time charting library.
- Vendors list for board name and there vendor id are taken from Stackblitz created by William Grasel