Storage Benchmark Results Chart¶
Specification¶
The full specification below is extracted from Chapter 15: Software Setup and the Developer Environment on the Raspberry Pi 5.
Type: chart
**sim-id:** storage-benchmark-results-chart<br/>
**Library:** Chart.js<br/>
**Status:** Specified
Learning objective: Students will *interpret* (Bloom L3: Apply) a `dd`-style storage benchmark result to decide which storage option best fits a given Pi 5 project.
Chart type: bar chart, responsive Chart.js canvas.
Purpose: show sample write-speed results (in megabytes per second) from running the chapter's `dd` benchmark command against three real storage devices, letting students connect the earlier abstract storage comparison to concrete measured numbers.
X-axis: three device categories — "MicroSD Card," "USB 3.0 External Drive," "NVMe via PCIe."
Y-axis: measured write speed in megabytes per second (MB/s).
Data series: a single bar per device using representative sample values (microSD lowest, USB 3.0 in the middle, NVMe clearly highest), colored gray, indigo `#3F51B5`, and circuit green `#2E7D32` respectively, matching the color convention from the Chapter 14 storage chart.
Interaction (required): a `<select>` control lets students pick a hypothetical project ("Text-based script," "Photo capture project," "Real-time video project") which redraws a horizontal threshold line on the chart marking the minimum write speed that project needs, so students can see which bars clear the bar for their chosen use case. Hovering any bar shows its exact MB/s value in a tooltip.
Implementation: Chart.js bar chart with `responsive: true` and `maintainAspectRatio: false`. Store the three threshold values keyed by project type and redraw the annotation line (via a Chart.js annotation plugin or a manually drawn overlay line) on the `<select>`'s `change` event, then call `chart.update()`.