Если рассматриваемое изображение на самом деле является картой или чем-то, что может быть разумно наложено на карту, используйте MapTiler (http://www.maptiler.org/), чтобы разбить его на плитки, а затем используйте такой код для отображения плиток:
var lat=37.767569;
var lon=-122.392223;
var initialZoom=17;
var tileDir = 'tiles_dir';
var mapTypeId = 'Your Custom Map';
var mapType = new google.maps.ImageMapType({
tileSize: new google.maps.Size(256,256),
getTileUrl: function(coord,zoom) {
return "img/"+tileDir+"/"+zoom+"/"+coord.x+"/"+coord.y+".png";
}
});
var map = new google.maps.Map(document.getElementById("map_canvas"),
{center:new google.maps.LatLng(lat,lon),
mapTypeId:google.maps.MapTypeId.ROADMAP,
zoom:initialZoom,
mapTypeControl:false});
map.overlayMapTypes.insertAt(0, mapType);
map.mapTypes.set(mapTypeId, styledMap);
map.setMapTypeId(mapTypeId);
Обратите внимание, что Map Tiler устанавливает имя изображения в соответствии с API Google Maps v2. Если вы используете v3 (и вам следует!), Вам нужно взять каждое имя файла (например, 2001.png) и переместить его в имя файла, подходящее для v3. Чтобы сделать это в Linux или Mac, перейдите в каталог плитки и запустите этот скрипт (обратите внимание, что скрипт предполагает, что вы находитесь в каталоге плиток!):
#!/bin/bash
tiles=`ls -d */*/*`
for thisPath in $tiles
do
thisFile=${thisPath#*/*/}
oldY=${thisFile%.png}
zoomX=${thisPath%/*}
zoom=${thisPath%/*/*}
newY=$(((1<<zoom) - oldY - 1))
mv ${zoomX}/${oldY}.png ${zoomX}/${newY}.png
done
Теперь, даже если ваше изображение на самом деле не является картой или чем-то, что было бы разумно наложено на карту, мы надеемся, что это даст вам некоторые идеи о том, где искать и что делать, если вы хотите использовать Карты Google. (Там могут быть инструменты, которые позволят вам легко создавать функции такого типа без Google Maps, но если это так, у меня нет опыта работы с ними.)