Map Game
wip2025A click-based geography quiz across six regions with color-graded feedback — green on first try, escalating to red as you miss.
No map library — every region is a pure SVG path, shuffled into a queue at game start. Correct answers pop the queue; wrong or skipped answers go to the back and bump the region's color toward red. react-zoom-pan-pinch handles pan and zoom on mobile and trackpad.
How It Works
Each game mode exports a Region[] of { id, name, abbreviation, svgPath } consumed by a shared useMapGame hook. The hook shuffles regions into a queue at start: a correct click pops the head, a wrong or skipped one rotates it to the tail and increments its attempt count. Color intensity is a function of attempts — first-try green, mid-difficulty yellow/orange, hard red — so the finished map doubles as a heatmap of your weak spots.