Crystal Lattice (2D): Rock-Salt Structure Viewer
A rotatable NaCl rock-salt lattice drawn on a plain 2D canvas: sodium and chlorine atoms are projected from 3D grid coordinates with real rotation matrices and sorted by depth, so the structure reads correctly from any angle.
This 2D companion mirrors the 3D Crystal Lattice sim's rock-salt (NaCl) structure — sodium and chlorine ions alternating on a cubic grid, bonded to their nearest neighbours along each axis — but draws it with plain 2D canvas arcs and lines instead of WebGL. Every atom and bond position is rotated with the same yaw/pitch rotation matrices a 3D engine would use and projected to the screen with a painter's-algorithm depth sort, so dragging the view or letting it auto-spin still reads as a real rotating 3D structure.
Canvas2D rock-salt (NaCl) lattice viewer: 3D grid coordinates rotated with standard rotation matrices and projected orthographically, with a painter's-algorithm depth sort for atoms and bonds. Grid size, spacing, auto-rotate speed and tilt are all live controls.
2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install
A rock-salt (NaCl) crystal lattice: sodium and chlorine ions alternate on a cubic grid and bond to their nearest neighbours along each axis.
Every atom position is rotated with standard yaw/pitch rotation matrices and projected onto the canvas with a painter's-algorithm depth sort, so nearer atoms and bonds are drawn over farther ones.
Drag with the mouse or a finger, or leave the auto-rotate speed slider above zero to let it spin on its own.