A grid diagram is a square grid with exactly one 'X' in each row and column and exactly one 'O' in each row and column. The 'X' and 'O' in each column are connected to each other, followed by the 'X' and 'O' in each row. Every link can be represented with a grid diagram.
(WebGL must be enabled. Touch the graph to interact with the diagram.)
Controls
| +: Increase the size of the grid |       | x: An 'X' will appear in the square the mouse pointer is in |
| -: Decrease the size of the grid |   | o: An 'O' will appear in the square the mouse pointer is in |
| UP: Raise vertical strands |   | p: Toggle planes for arc presentation |
| DOWN: Lower vertical strands |   | LEFT: Shorten horizontal strands |
| g: Toggle grid |   | RIGHT: Lengthen horizontal strands |
| k: Toggle knot |