bit:plot — user guide

1. What is this, and what is it for?

bit:plot is a measurement system that runs in the browser for classroom experiments: it plots the sensor data of a device connected over USB (micro:bit, Arduino, Raspberry Pi Pico…) live, with thirteen chart types, and can also reload and compare earlier measurements. No installation and no server are needed: all data stays on your computer, nothing is uploaded to the internet.

The interface is available in three languages (Hungarian, English, German) — switch it with the drop-down at the top right.

2. What do you need?

• For live measurement: Chrome or Edge (because of the Web Serial technology) — on a desktop or laptop.
• For analysing earlier data: any modern browser, even on a tablet (not for measuring, but yes for analysing).
• A sensor device with a USB cable (for live measurement), or a previously saved CSV file.

3. Preparing the device (micro:bit)

The device must write its data to the serial port at 115200 baud. The program understands two formats:

• Named: temperature:23.5 — one or more name:value pairs per line, separated by commas (e.g. x:120,y:-40,z:980).
• Raw number: just a single number per line (e.g. 35) — the program takes it as “value” automatically (with several numbers: “value 1”, “value 2”…).

MakeCode example (built from blocks)

A single named value (name:value) — e.g. temperature with the “serial write value” block:

Several raw numbers at once (e.g. the X-Y-Z axes of the accelerometer) — with the “serial write numbers” block, as an array:

MicroPython example

from microbit import *

while True:
    print("temperature:{}".format(temperature()))
    sleep(200)

4. First live measurement, step by step

1. Connect the device to the computer with a USB cable.
2. Click the Connect button (top right) and pick the device from the pop-up list (e.g. “mbed Serial Port” or “USB Serial Device”).
3. Click Start measurement — the data is drawn live.
4. When finished: Stop measurement. The data stays in the view, ready to be saved or analysed.

5. The interface at a glance

Header (top row)

Control bar

• Data (top left, only with loaded data): which data source to focus — from a drop-down.
• Time window: 10 s / 30 s / 1 min / Full / Custom — how much of the time series is shown.
• Chart-type tiles (centre): the thirteen chart types — switchable in one click, the data is not lost.
• ‹ Back (below the tiles, only when there is somewhere to go): one level up from the focused data/panel.
• Axes: Separate panels / Shared / Two axes (for time-series types).
• Scale (for meter bars, 3D and radar): manual min–max bounds — empty means automatic.
• Statistic (for pie, meter bars, big number and radar): what the chart shows from the window’s data — Last / Sum / Average / Count.
• Cumulative (for time-series types): the running total of the channels from the start of the window — for event counting (sending 1 per event) this is the growing “total events over time” curve (e.g. total cars so far). It combines with Prediction: the fit then runs on the cumulative curve — cumulative cases + logistic estimates the final total (plateau), event count + linear estimates the rate.
• Prediction (right): curve fitting on/off.

6. Chart types

7. Time window, zoom, 3D rotation

• Live windows (10 s / 30 s / 1 min): the view follows the fresh data. Full shows the entire measurement.
• Custom: a from–to range you type in (in seconds) — clicking the button opens the fields.
• Zoom in by dragging: on the time-series chart select a section with the mouse.
• Wheel: zooms in/out around the time under the cursor. Scrolling out expands to the whole measurement.
• In 3D view: drag = rotate, wheel = zoom. The Scale fields fix a common range for the axes (e.g. -1024 – 1024 for the accelerometer) — so the cube does not “breathe” even during live measurement; if the data exceeds it, the view expands on its own and never cuts the trajectory.

8. Customising data series

Click a data series’ name in the legend (below the chart) — a pop-up lets you set:

• Name: renaming (channels of loaded data too!) — the axis labels and the header of the saved CSV use this as well;
• visible: turning the series on/off — affects every chart type (an unwanted channel can be hidden);
• colour, line style (solid/dashed/dotted), point (size and shape: circle, triangle, square, star…).

In Two axes mode the “Left / right axis…” button opens a panel where you can assign which channel goes to which side — for data of different magnitudes (e.g. temperature and light level together).

9. Loading earlier data and comparing

1. Open the Data… panel.
2. Load the measurement From file… (several files can be selected) or From clipboard… (e.g. CSV copied from the micro:bit data log).

• With one loaded dataset that dataset is shown right away, with the full toolset.
• With several the “All (comparison)” view starts: for time-series types on one shared chart, for the other types one small figure per source.
• Focusing: click a small figure, or pick from the “Data” drop-down — the full toolset (prediction too) switches to that dataset. The ‹ Back button returns to the comparison.
• Live measurement alongside loaded data: if you connect and measure, the “Current” measurement is drawn next to the loaded ones in real time — so the fresh experiment can be compared with the earlier one.
• Deleting: from the panel’s “Delete” drop-down you can choose to drop one specific dataset or all of them.

10. Table view

The Table button shows the raw numbers (time + channels) in a movable, resizable window. Clicking a row highlights the matching point on the chart with a time marker. The number of rows can be limited (20 / 100 / 500 / All).

11. Prediction (curve fitting)

In a time-series view, the program fits a model to a chosen channel and forecasts up to twice the measurement’s span — “what do we expect next?”. Three models are available:

• Linear — steady change (y = a·t + b);
• Exponential — cooling/decay, tending to a limit;
• Logistic — saturating growth (S-curve).

The fitted equation and R² (goodness of fit) appear below the chart. On the first activation, downloading the numerical packages (numpy/scipy) may take a minute or two — the measurement keeps running undisturbed meanwhile.

Together with the Cumulative switch, the prediction fits the running-total curve — this is the classic forecasting combination: event counting + linear gives the rate and the expected final total at a given time; the saturating case count (cumulative) + logistic estimates the plateau (total number of cases), as with epidemic curves.

12. Saving (CSV, PNG)

• Save CSV: you can choose to save the whole measurement or only the visible view. The header contains the channel names and units you set. The saved CSV can later be reloaded in the “Data…” panel — this is the recommended archiving format.
• Save PNG: an image of the current chart (with the legend), e.g. for a lab report or a presentation.

13. Troubleshooting