I have put together a cities database from MaxMind and it includes the lat/lng values for each city in the database. I have also put together a map of North/America and I would like to have a icon appear on the x/y coordinates of the map which are derived from the lat/lng coordinates of the city database record.
From my understanding I need to find the left/top bounds of the map first (lat/lng -> x/y) and then use that as a difference for the linear relationship between any of the north american city x/y coords. Finally, depending on the size of the map, its just a few simple division and subtraction operations to figure out where to place the point.
However I can't seem to figure out how todo the following:
Latitude and Longitude are imaginary lines drawn on earth so that you can accurately pinpoint any location on the world . simply put they are the X and Y coords of a plane. Latitude is a vertical line running from north to south with its 90 deg at the north pole and -90deg at the south pole.
Longitude on the other hand is a horizontal line running east to south with -180deg in the west and 180deg in the east.
you can convert the latLng into pixel coords as by assuming that the width of the html container is the width of the world and the same applies to the the height.
Formula - Longitude - pixel
where 360 is the total longitude in degrees
Formula -Latitude - pixed
where 360 is the total longitude in degree
//Height is calculated from the bottom
let me know if you still need any clarifications.