Javascript-如何选择图像的一部分以更改颜色

Question

I have an image that is completely white. I want to select certain hexagonal sections to make them different colors, and then make the sections act like buttons that call different functions when they're clicked. I think I know how I would change the background color and make them clickable, but I don't know how to select a hexagonal section to change those things. Can anyone help me? (without jQuery)

EDIT: I figured out how to change set apart the hexagonal sections, and how to make them clickable like a button, but I can't figure out how to change the color of each part. How do you do that?

Answer 1

You could try using an image map:

<img src="planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">
<map name="planetmap">
  <area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
  <area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
  <area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>

HTML < map> Tag

Here's a hexagon example:

HTML Color Picker