Swift plot coordinates on uiimageview with world map

Question

I am trying to plot some coordinates on the earth on an UIImage which contains a map of the world. (I don't want to use maps)

See an example of the UIImageView below below:

As you see it's working out pretty well but the mapping from coordinates and X Y are incorrect!

Amsterdam's coordinates are: (52.36666489, 4.883333206) and the Center's are (0,0).

I've done the following things to try to make this happen but unfortunately this isn't working out:

1. I've tried first to 'normalize' the coordinates since latitude ranges from -90 to 90 and latitude -180 to 180. This is done by adding 90 to the real latitude and 180 to the real longitude which yiels the 'normalized' versions:

let normalizedLat = location.coordinate.latitude + 90.0. let normalizedLng = location.coordinate.longitude + 180.0

2. After that I've calculated the scale factor where the normalizedLat and normalizedLng should scale with:

let heightScaleFactor = mapImageView.frame.height / 180.0 let widthScaleFActor = mapImageView.frame.width / 360.0

And 3. After that i've got the scaling factors I finally can calculate the coordinates by:

let x = Double(widthScaleFActor * CGFloat(normalizedLng)) let y = Double(heightScaleFactor * CGFloat(normalizedLat)) dot.frame = CGRect(x: x, y: y, width: Double(dot.frame.width), height: Double(dot.frame.height))

But for some strange reason Amsterdam is not on the Amsterdam spot and the Center is not on the Center spot.

I am quite sure that my calculations has gone wrong. Any ideas?

Answer 1

Remember, in iOS the origin is in the top-left, not the bottom-left. Positive-y goes down, not up.

You need to factor that in.

dot.frame = CGRect(x: x, y: mapImageView.frame.height - y, width: Double(dot.frame.width), height: Double(dot.frame.height))

Also note that the equator in your image is not in the middle. It's lower in the image so you need to add an additional offset in your calculation of the y value based on the equator's offset in the image.

dot.frame = CGRect(x: x, y: mapImageView.frame.height - y + equatorOffset, width: Double(dot.frame.width), height: Double(dot.frame.height))

It's also possible that your map projection doesn't have a simple linear latitude scale. 0-10 degrees might be 12 pixels while 10-20 degrees might be 11 pixels, etc. and 80-90 is only 3 pixels (or whatever).