Waveform Viewer

After running a simulation, SpiceBook renders the results as interactive SVG plots directly beneath the SPICE cell. The viewer adapts to the analysis type automatically.

Plot Types

Time-Domain (Transient / DC Sweep)

Transient (.tran) and DC sweep (.dc) results display as standard XY plots:

X-axis: time (seconds) or swept parameter value
Y-axis: node voltages and branch currents
Multiple traces are overlaid with distinct colors from an 8-color palette

Each trace is labeled with its signal name (v(out), i(R1), etc.).

Frequency-Domain (AC Analysis)

AC analysis (.ac) results display as a Bode plot with two subplots:

Top: Magnitude in dB vs frequency (log scale)
Bottom: Phase in degrees vs frequency (log scale)

The viewer detects AC data automatically when is_complex is true in the waveform data and switches to this dual-plot layout.

Oscilloscope Mode

The SpiceBook homepage features an animated oscilloscope display that renders waveform data in a CRT-style aesthetic — cyan traces on a dark background with phosphor-glow effects. This same rendering engine is available for waveform data throughout the application.

The oscilloscope uses a dedicated color palette:

Axes: #475569 (slate-600)
Grid: rgba(51, 65, 85, 0.5) (slate-700 at 50%)
Traces: #2dd4bf (cyan-500 for the classic scope look)

Trace Colors

Multi-signal plots use an 8-color palette designed for readability on both dark and light backgrounds:

Trace	Color
1	Blue (`#2563eb`)
2	Red (`#dc2626`)
3	Green (`#16a34a`)
4	Amber (`#ca8a04`)
5	Cyan (`#0891b2`)
6	Rose (`#e11d48`)
7	Slate (`#4b5563`)
8	Orange (`#ea580c`)

SVG Generation via API

Waveform plots can also be generated server-side via the REST API. Send the waveform data from a simulation response to the SVG endpoint:

curl -X POST https://spicebook.warehack.ing/api/waveforms/svg/raw \
  -H "Content-Type: application/json" \
  -d '{
    "waveform": { ...waveform data... },
    "title": "RC Filter Response",
    "width": 800,
    "height": 500,
    "signals": ["v(out)"]
  }' \
  -o plot.svg

The signals array lets you select which traces to include. Omit it to plot all signals. See the Waveforms & Schematics API reference for full details.