Google지도 API V3 - 사용자 정의 타일

Question

나는 현재는 21 ~ 23 사이에 확대 할 경우 here

를 통해 구글지도 API V3 일하고는지도에 이미지 오버레이가있을 것입니다. 이미지를로드하는 데 너무 오래 걸리고 더 쉽게로드 할 수 있도록 여러 타일로 나누기로 결정했습니다. 타일을 자르려면 자동 타일 커터를 사용하고 있습니다.

스크립트에 문제가 있습니다.

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 

첫 번째 질문 당신은 어떻게 포토샵 문서에서 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); 

Answer 1

자동 타일 커터를 사용하는 대신 MapTiler를 사용하고 추천했습니다. 이미지를 타일로 조각뿐만 아니라 그것을 사용하는 자바 스크립트 타일 스크립트를 생성합니다.

그러나 스크립트는 v2로 작성되었습니다.

V3 타일 스크립트

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); 
} 

Credits