# Plotting latitude on (Mercator projection) SVG representing country map

I want to convert (google sourced) longitude and latitude coordinates to x and y to place points on a SVG map

I can get the longitude converted to X but I can't nail latitude.

http://jsfiddle.net/chrisloughnane/an3BZ/17/

• red dots = place holders
• green dot = calculated position from longitude/latitude

I have read so much about Mercator projections and other projection system API's I am now completely confused. I also followed Proj4JS library threads but couldn't find an example that was close to my task.

I attempted to emulate @Raphael Wichmann and @betamax solution, unfortunately I got something wrong.

Could someone have a look at my jsfiddle and see if it's an obvious mistake?

The second test function secondconvert(latitude, longitude) (bottom of javascript pane) provides me with a reasonably accurate x coordinate i.e. if I manually enter the y coordinate `b.ylat` change to `265` it covers my left red dot place holder nearly perfectly.

I think I'm close.

Note: the longitude/latitude bounds I used for my SVG map are best guesstimates, worked surprisingly well for the longitude calculation.

Original SVG from here.

• Is your solution generic? Would be great if you provide a bit of a write up on how the formula works. – Learner Apr 10 '19 at 6:07
• I assume the MAP_WIDTH = 400; MAP_HEIGHT = 500; properties are the SVG dimensions. How did you calculate westLong, eastLong etc? Assuming they are mercator coords of the top left and bottom right of the map? Thanks – Learner Apr 10 '19 at 6:43
• Hi, I'm sorry I wrote that code nearly 7 years ago and I'm in the middle of a complex project but if I get an hour at the weekend I'll revisit the solution and see what I can do for you. In the mean time try the working version jsfiddle link below and the link to the the other reference. – Chris Apr 10 '19 at 16:36
• Thanks. I've found a working solution using my own inputs. I don't understand why the math works, but it does. I think that would be the most interested area to comment on. – Learner Apr 11 '19 at 0:37
• Enjoy :) en.wikipedia.org/wiki/… – Chris Apr 11 '19 at 11:13