Google Maps API V3 - 自定义图块

sil*_*btf 7 imagemap tile google-maps-api-3 maptiler

我目前正在对谷歌地图API V3在这里

如果您在21到23之间缩放,地图上将会有一个图像叠加层.图像需要很长时间才能加载,我决定将其分解成不同的图块以便于加载.我正在使用自动瓷砖切割机将图像切割成瓷砖.

我的脚本有问题;

    var OrgX = 31551;   // the Google Maps X value of the tile at the top left corner of your Photoshop document 
    var OrgY = 50899;   // the Google Maps Y value of the tile at the top left corner of your Photoshop document
Run Code Online (Sandbox Code Playgroud)

第一个问题如何从photoshop文档中找到X和Y的值?

如果我设法解决第一个问题,那就说吧.

第二个问题以下代码是否正确显示瓷砖取决于缩放级别?或者我错过了任何代码?

var BuildingsLayer = new google.maps.ImageMapType({
    getTileUrl: function(coord, zoom) {
        return "http://search.missouristate.edu/map/tilesets/baselayer/" + zoom + "_" + coord.x + "_" + coord.y + ".png";
    },
    tileSize: new google.maps.Size(256, 256),
    isPng: true
});

map.overlayMapTypes.push(BuildingsLayer);
Run Code Online (Sandbox Code Playgroud)

sil*_*btf 10

我使用并推荐了MapTiler,而不是使用Automatic Tile Cutter.它不仅将图像切割成图块,还会生成一个javascript图块脚本来使用它.

但是,脚本是用v2编写的.您可以根据以下内容编辑代码:

v3 tile脚本

var maptiler = new google.maps.ImageMapType({ 
  getTileUrl: function(coord, zoom) { 
return zoom + "/" + coord.x + "/" + (Math.pow(2,zoom)-coord.y-1) + ".png"; 
}, 
  tileSize: new google.maps.Size(256, 256), 
  isPng: true 
}); 

var map; 

function initialize() { 
 map = new google.maps.Map(document.getElementById("map_canvas")); 
 map.setCenter(new google.maps.LatLng(36.07, -112.19)); 
 map.setZoom(11); 
 map.setMapTypeId('satellite'); 
 map.overlayMapTypes.insertAt(0, maptiler); 
}
Run Code Online (Sandbox Code Playgroud)

积分