five-on-it / apps/client/src/ui/Minimap
apps/client/src/ui/Minimap
The minimap in the bottom-right corner: the whole city north-up at a fixed zoom, its districts tinted by their themes with their titles written over them, the ground lighter the higher it stands (terraces, ramps, hills), the roads as dark strips along their centre lines, the buildings, structures and props as footprints in their colours, the player as a yellow arrow, other players in their colours (in a run of teams, their team's, bigger and ringed: team-colors.ts), pedestrians as faint dots, enemies in orange and chasers in the colour of what they are doing once the server reads them out, the police flashing blue and red, the phone's waypoint as a cyan diamond with an arrow on the map's edge pointing the way to it; the mission's targets as gold rings (every one of a parallel group's) and the route line to the nearest over the roads, the other members of the player's party as green rings wherever they are, the phone's camera frame while its page is out; the guards' view cones (coloured by their alert phase) and the security cameras' cones always, the other NPCs' while the toggle is on. The static layer is drawn once per level into an offscreen canvas (minimap-draw.ts, which the phone's map draws too) and blitted under the markers whenever they change.