Przeanalizuj
http://www.praca.pl/js/mootools/ShapeHoverPoland.js - tak zrobili to tam
Ty pewnie słabo umiesz canvas. Pozostają Ci 2 opcje:
1. Nauczyć się go
2. Wykonać to w inny sposób.
Pokrótce jak możesz to wykonać w drugi sposób:
- musisz się zapoznać z HTML-owskimi: map i area
- teraz robisz siatkę( kilka obrazków ) z Twojej mapy:
Kod
A B C
D E F
G H I
- ustawiasz te obrazki tak, żeby to przypominało mapę -> CSS
- teraz przypisujesz zdarzenie myszy( mouseover/out ) w taki sposób, że jak najdziesz na odpowiedni obszar( <area> ) to podmieniają się obrazki, które zawierają dany obszar i dzięki temu powstaje efekt rollover( hover ): np. gdy najdziesz na "B" to możliwe, że będziesz musiał zmienić kilka obrazków
- przy kliknięciu wykonujesz inne zdarzenie - np. zaznaczasz te checkbox-y