Interactive(clickable) map

Question

I have a map of a camping, this is it:

Now, on this map, there are a lot of camping places. And all of the places(yellow, pink and the striped yellow), need

Answer 1

Basic idea: Create a color map to look up which spot the user has clicked.

To create that color map, start with the original map, overlay it with an empty bitmap and write a small tool application to help you:

• it should let you paint a filled circle in a special color for each site spot
• ideally those colors should allow you to re-construct the number and type of the places
• upon each click the next color should be prepared
• you don't need to match the place too exactly, but it is up to you to improve the colormap with a paint program; put the orginal map in a layer under it and use an eyedropper tool to get the right color and then draw the places a little better
• as many of the places have consecutive numbers you can
  • count them up with each click
  • use an input box to set new starting numbers

For the actual application you should

• hold the color map in memory
• use the MouseClick of a PictureBox to get the coordinates of the place
• multiply (or rather divide) those with the zoom factor
• use GetPixel on the color map to get the color and then
• extract the place number.

An ARGB color has 3 color bytes; two will suffice for the place numbers and you will still have one byte for the color coded types of places..

The zoom factor is 1f * PictureBox.clientSize.Width / PictureBox.Image.Width.

For best user experience I would use the PictureBox.MouseMove to look up the place in the color map and give feedback whenever the color changes, including setting and clearing the mouse cursor betwenn Hand and Default whenever the location is clickable, i.e. has a non-transparent color on the color map..

To avoid artifacts the color map must be stored asPNG , not as JPG!

If you want more info with the places you could (and should) create a Place class and hold a Dictionary<Color, Place> to look up Place by Color..

Answer 2

If you put the image in a PictureBox, say, you could use the MouseClick event.