An interactive visualisation of the bulk magnetisation vector and detected signals during a standard 1D NMR (Nuclear Magnetic Resonance) experiment.
It is meant as an educational tool for students of spectroscopy or physics learning about programming and spin dynamics / NMR signal formation.
🔗 Live demo: tkimhofer.github.io/nmr_visualisation
I've added a button top-left to apply RF pulse.
This project implements and visualises the fundamental physical processes in a standard 90° NMR experiment — from nuclear spin alignment to RF excitation, signal precession, relaxation, and data detection — using an animated 3D scene rendered with Three.js.
The magnetisation dynamics are computed from the analytical solutions to the Bloch equations 1 for free precession and relaxation after a 90° pulse in the laboratory frame.
Key features
- Animated bulk magnetization vector with 3D axes.
- Real-time exponential
T1/T2relaxation simulation - Orthogonal detectors and complex signal traces
- Interactive orbit, zoom, and reset button (see upper left)
See src/code.js for more implementation details of the signal model and relaxation terms.
At its core, an NMR spectrometer comprises a powerful magnet, a probe with radio-frequency coils and transmit/receive electronics for signal excitation and detection.
NMR systems commonly found in research settings have a magnetic field strength of ~14.1 Tesla. Conventionally, this number is quoted by the corresponding 1H (Proton) resonance frequency: 14.1 T ≈ 600 MHz (nominal).
In comparison, clinical MRI systems have much lower field strengths, usually 1.5–3 T, with up to 7 T being considered as ultra-high-field MRI.
- Temperature & field stabilisation
- Locking, shimming, tuning & matching, RF pulse calibration, etc.
- NMR-sensitive nuclei align parallel or antiparallel to magnetic field
B0(vertical/blue axis in visualisation) - Parallel/antiparallel orientations correspond to low/high energy states (for 1H, where γ > 0 → antiparallel = low energy, see also reference #2)
- Slight excess population in the low-energy state → net bulk magnetization (
M) - Population difference proportional to magnetic field strength 3
- (higher magnetic field strength increases chemical shift dispersion, ie., less peak overlap)
- Bulk magnetization vector
M(white) is the sum of individual nuclear magnetic moments - Longitudinal axis:
zalongB0(Mzcomponent) - Transverse axes:
x(red) andy(green), forming theMxyplane
- Exposed to radiofrequency (RF) pulse ->
B1 - RF pulse calibrated to rotate
Mby 90° into xy-plane Mstarts precessing around z-axis at the Larmor frequency (omega0in code)
A. Relaxation effects
- Magnitude of
Mxydecays whileMzrecovers, due to: - T2: mutual magnetic interactions between spins → loss of phase coherence (spin-spin relax.)
- T1: interactions with lattice/environment → recovery along z-axis (spin-lattice relax.)
- Typically,
T2 ≤ T1.
B. Signal detection
- The precessing
Mxyinduces voltage in two orthogonal receiver coils (90° phase difference) - Detectors / recever channels shown as orange and green cones 4
- Resulting time-domain signals are drawn as orange and green traces
C. Complex signal representation
- Recorded time-domain signals are a complex-valued:
s(t) = s_Re(t) + i* s_Im(t) - The real (
s_Re) and imaginary (s_Im) parts correspond to the two receiver channels - After Fourier transformation:
- Real → absorptive line shape
- Imaginary → dispersive component
- Longitudinal magnetization
Mzgrows until equilibrium re-established
- Once equilibrium is reached, the acquisition cycle repeats
- The number of repetitions (Bruker parameter
NS: Number of Scans) determines signal averaging - Signal-to-noise ratio (S/N) increases proportionally to the square root of the number of scans