title: Define multiple click regions on one image
body: <p>I'm trying to figure out the best way to go about doing this.</p>
  
  <p>Basically I have one image that is the map of the United States and I want to be able to define a click region for each state. (so they have to be odd shaped)</p>
  
  <p>I've done some research about defining hit regions in html5 canvas and with javascript. Although I haven't found much on creating odd shaped regions.. </p>
  
  <p>Is this the best way to go about it? Do y'all have any other suggestions?</p>
  
  <p>I'm also wanting to be able to highlight the individual region once the mouse is over it and have it change colors based on the click order so the region defined has to be fairly accurate.</p>
  
  <p>Would it be best to split each state up into different images and then use absolute positioning inside a main container?</p>