mapping latitude and longitude values onto an image

Question

i'm trying to geocode values and map them to a satellite image of a city (new york city to be precise). i've successfully done this before using a geospatial image of the world, and then mapped/scaled longitude and latitude values from the max lat/lng range (-90,90 & -180,180) to the max width and hight of the image (0,width & 0,height) which worked perfectly. i'm a bit confused how to do this to just a map of a city.

currently, i have a hi-res satellite image of new york city, and have positioned it so that it perfectly aligns with the map of new york city on Google Maps (i'm using their API to geocode my locations). i've attempted to get the top/bottom latitude values and left/right longitude values of the satellite image i'm using, and tried to scale any longitude/latitude values that needed to be mapped onto the image within this range. however, this didn't seem to work. is there another method i could use so that it would be possible to dynamically map lat/lng coordinates onto a satellite image of new york city?

this is essentially the image that i would like to map onto:

thanks.

Answer 1

If you know the image size and its geographic extent (lat/lon values), you can use something like:

x = imageWidth * ( pointLon - ImageExtentLeft ) / (ImageExtentRight - ImageExtentLeft);
y = imageHeight * ( 1 - ( pointLat - ImageExtentBottom) / (ImageExtentTop - mImageExtentBottom));

By the way, if you are using the Google Maps API to geocode your locations, why don't you use its functions to add markers directly to your map? (Maybe I didn't completely understand your case)

var latlng = new GLatLng(pointLat, pointLon);
map.addOverlay(new GMarker(latlng));

Hope it helps