Link to home
Start Free TrialLog in
Avatar of damion69
damion69

asked on

Map a Map

Hence the name, i am wanting to take a map of the US, and when a user clicks on any state, the program needs to recognise what state the user is clicking on. I am looking for Ideas and source code. I was thinking about using colors to go about it, but i plan to change colors ect. The basis of this is going to be a game kinda like risk.
Avatar of rkot2000
rkot2000

you can use MouseUp(Button As Integer, Shift As Integer, X As Single, Y As Single) event to get x,y and create if statetemenst
If you do this in HTML, you can map it according to polygon regions and have it hyperlink to something related to the state.  That doesn't sound like exactly what you want, but the same concept can be applied.

What you do is define a database of coordinates and use rkot2000's code to determine if the (x,y) coordinate is within a specific area.  Since the regions can get complex (see West Virginia and Alaska) I think your original color idea is better.

Originially I thought that you'd need 50 colors, but you can limit it by breaking the map into different regions, and any color picked up from the mouse coordinates within a region would be mapped back to a specific state.

For example, block off the New England area and make Maine red, New Hampshire green, Vermont white, Massachusetts yellow, Rhode Island blue, Connecticut orange, and New York black. (New York is included because it is part of the rectangle for that region.)  When the mouse clicks in that region, the color defines the state.  Repeat for other regions such at the Middle Atlantic states, where, of course, New York would still have to be black, but now New Jersey can be yellow, etc.)
Avatar of Mike McCracken
listening
You actually only need three colours, this is the minimum requirement for mapping areas in this way. You can then use the Point method in the mousedown event to return the colour of the specified point:

Private Sub Picture1_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single)
    MsgBox Picture1.Point(X, Y)
End Sub
Actually it's four colours, I remember because I found 5 colours combination in high school (of course, it was wrong :)
See http://www.math.gatech.edu/~thomas/FC/fourcolor.html (Theorem & US map)

You can create each Region by using APIs:
BeginPath, MoveToEx (for starting point), LineTo (for each point), CloseFigure, EndPath and PathToRegion.

To check mouse position, use HitTest in MouseMove:

        For Each Region In Regions                  ' search all regions
            If Region.HitTest(x, y) Then
                Status = Region.Description         ' point was inside region
                Exit Sub
            End If
        Next
        Status = "Mouse Is Not Over Defined Area"   ' nothing hit
>To check mouse position, use HitTest in MouseMove:
OOPS, use PtInRegion API in MouseMove

Public Function HitTest(x, y) As Boolean
    HitTest = PtInRegion(hRegion, x, y)
End Function
Although the 4-color idea is good, it means extra overhead in determining which state you're in.  That's why I decided to use more colors over a larger area.

For example, in the case of the smaller states, how do you know where you are?

Looking at "http://www.mapquest.com/atlas/main.adp?region=usa" or "http://www.mapquest.com/atlas/main.adp?region=maryland" as a reference, notice that Delaware, Maryland, New Jersey, West Virginia, Virginia, and Pennsylvania are all within a small area of Washington DC.

How would you color these 6 states plus DC?  And more importantly, how would you use the color to determine which state you'r in?
Maybe you split/cut your big image on smaller images, like one image per state.
ASKER CERTIFIED SOLUTION
Avatar of ameba
ameba
Flag of Croatia image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of damion69

ASKER

Wow alot of responses... Thank you all for your help, i am going to try these suggestions.
Wow alot of responses... Thank you all for your help, i am going to try these suggestions.
Hi!

How about using an array of controls like label or imagebox or picturebox... with the click event.  Then you could do something like:

Select Case Index

Case 1
'...
Case 2
'...
'...

End Select

Then, you could asign the left and right coordinates by reading from a file that you'll create from or you could manually set the coordinates yourself.

That's it!

glass cookie : )
Actually, I used to use just this problem for teaching some techniques in my VB class.  Here is another approach.

Let's say that the map that you want the user to see and to click on, you don't want to muddy it up with lots of strange colors, you just want it to look like a nice topographical map.  So, what you do is put two picture boxes on your form.  Set each's scalemode to pixel, and then load the regular map into one of the pictureboxes.  Then, take that map, and color in each state in a different color, and save this as a second bitmap.  Make sure to save the RGB values of each state.  Now, load this second bitmap into the second picturebox.  Set the Autoredraw property to true on both picture boxes, and move the second picturebox directly underneath the first picturebox (and you can even set it's visible property to false).

Then, in the MouseDown event of the Top picturebox, you'd have code like:


Private Declare Function GetPixel Lib "gdi32" Alias "GetPixel" (ByVal hdc As Long, ByVal x As Long, ByVal y As Long) As Long
 
Private Sub picTop_MouseDown(Button As Integer, Shift As Integer, X As Single, Y As Single)
Dim lColor as Long

' Note, you're getting the color value of the pixel from
' the corresponding location in the hidden picture
lColor = GetPixel(picBottom.hdc, x, y)
Select Case lColor
   Case RGB(255,255,255) ' the rgb setting for CA
      msgbox "You clicked on California"
 
   Case RGB(255,0,0) ' the rgb setting for NY
      msgbox "You clicked on New York"

   Case RGB(0,255,0) ' the rgb setting for Id
      msgbox "You clicked on Idaho"
End Select

End Sub
That's a real good idea, mdougan.  Then you can use 50 different colors without it looking weird.  And the hidden picture could probably be anywhere since the relative positions for the X and Y will be the same.

You could even make it real simple and sort the states alphabetically in an array, then color the states according to their index in the array:


Alabama = &H000001
Alaska = &H000002
...

Optional state borders can be black (&H000000) so if the user clicks on the border, it ignores the click. or looks at the surrounding 8 pixels to display all adjacent states.

The only problem with the above is that the colors will be difficult to differentiate with the human eye, but the computer won't care.
Good points rspahitz,

However, I'd suggest a larger margin between the color values of the states.  When I actually did this, I was trying to get the RGB values from the paint package, and found that colors that looked different because of their luminosity or whatever, actually ended up with the same RGB value.  So, I found it useful to go in to the paint package and explicitly set RGB values wide enough apart that it was pretty plain which was which.

As far as the colors being difficult to differentiate, you have a point, but, you might want to be able to tell the differences in the states in the colored bitmap (say to draw borders or whatever) after the fact, so, again, I'd suggest a little wider spread in the color values.
This is what i was looking for... this gives me the idae of how to do it, and also an example of it in use. Thank You for all of your help.
:-) Thanks