Google Maps API V3 - пользовательские плитки
В настоящее время я работаю над Google Maps API V3 здесь
При увеличении от 21 до 23 на карте будет наложение изображения. Изображение загружается слишком долго, и я решил разбить его на несколько фрагментов для более легкой загрузки. Я использую Automatic Tile Cutter, чтобы разрезать изображение на плитки.
У меня проблемы со сценарием;
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 в документе Photoshop?
Скажем, если мне удастся решить первый вопрос.
Второй вопрос Правильный ли приведенный ниже код для отображения плиток в зависимости от уровня масштабирования? Или я пропускаю какие-либо коды?
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);
1 ответ
Вместо того, чтобы использовать Автоматический Резак Плитки, я использовал и рекомендовал MapTiler. Он не только нарезает изображение на листы, но также генерирует скрипт плиток javascript для его использования.
Тем не менее, сценарий написан в 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);
}