Home▸Probability & Statistics▸Hidden Markov Model — Canvas Trellis (2D)

🎲 Hidden Markov Model — Canvas Trellis (2D)

2D Canvas trellis view of a hidden Markov model: sample observations from editable transition/emission matrices, decode the most likely hidden path with the Viterbi algorithm, and watch forward-algorithm state probabilities light up each column.

Probability & Statistics2DAdvanced60 FPS📱 Mobile-adapted⇄ 3D version
2d-hidden-markov ↗ Open standalone

This 2D companion drives the exact same hidden Markov model math as the 3D version — sampling from editable transition and emission matrices, Viterbi decoding, and the forward algorithm — but draws the trellis on a flat Canvas2D grid instead of a WebGL point cloud, so every edge, node and back-pointer reads as plain 2D geometry.

Frequently Asked Questions

How is this different from the 3D version?

Same math — sampling, Viterbi decoding and the forward algorithm run identically. Only the rendering differs: this page draws the trellis with plain Canvas2D calls instead of a WebGL point cloud, which keeps the geometry legible at a glance.

What is the Viterbi algorithm?

The Viterbi algorithm efficiently finds the most probable sequence of hidden states given an observation sequence using dynamic programming. It runs in O(T·K²) time, where T is the sequence length and K is the number of states.

What do the node sizes on the trellis mean?

After decoding, each node's radius scales with its forward-algorithm probability — the chance of being in that state at that time step given all observations so far. Larger nodes are more likely states.

Why do the rings (true states) sometimes disagree with the Viterbi path?

The Viterbi path is the model's best guess from the observations alone. The rings mark the actual hidden states used to generate the sequence. They diverge when the emission probabilities are ambiguous — the same observation can plausibly come from more than one state.

⚙ Under the hood

2D Canvas trellis view of a hidden Markov model: sample observations from editable transition/emission matrices, decode with Viterbi, and watch forward-algorithm probabilities light up each column.

HMMMarkovforward algorithmViterbiCanvas 2D

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install

What did you find?

Add reproduction steps (optional)