Google Maps API V3 - Custom Tiles

I am currently working on the Google Maps API V3 over here

If you increase the distance from 21 to 23, an overlay image will appear on the map. The image has been loading for too long, and I decided to split it into different tiles to simplify the loading. I use an automatic tile cutter to cut an image into tiles.

I have problems with the script;

    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

First question How do you find the X and Y values ​​from a photoshop document?

Say, if I can solve the first question.

Second question Is the correct code below displaying tiles depending on the zoom level? Or am I missing any codes?

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);
+5
1

Automatic Tile Cutter MapTiler. , javascript script, .

script v2. :

v3 script

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

+9

All Articles