Google MAP API Javascript, modify tile size while zooming

95 views
Skip to first unread message

elias cohen

unread,
Apr 12, 2018, 8:46:57 PM4/12/18
to Google Maps JavaScript API v3

I am currently working on the Google MAP API for a personal project. I am using around 1000 pictures to create my own map. Hence, I am using the example of Google API moon example and it works great.

However, in my case, I want to add some differences but I have a problem. I am trying to use the same images for each level of zoom and just changing the tile size for each level of zoom. For example, for a zoom=9, I want my tile size = 512*512, for zoom=8, tile size=256*256 ... I tried to write the code but no success.


function initMap() {
        var map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: 0, lng: 0},
          zoom: 1,
          streetViewControl: false,
          mapTypeControlOptions: {
            mapTypeIds: ['Project']
          }
        });
       
        var moonMapType = new google.maps.ImageMapType({
          getTileUrl: function(coord, zoom) {
              var normalizedCoord = getNormalizedCoord(coord, zoom);
              if (!normalizedCoord) {
                return null;
              }
              var bound = Math.pow(2, zoom);
              return 'file:///C:/Users/Desktop/PHOTOS/'
                     + zoom + '.' + normalizedCoord.x + '.' +
                  (bound - normalizedCoord.y - 1) + '.jpeg';     
          },
   
          tileSize: new google.maps.Size(256,256),
          maxZoom: 9,
          minZoom: 0,
          radius: 1738000,
          name: 'Project'
        });

        map.mapTypes.set('Project', moonMapType);
        map.setMapTypeId('Project');
      }

Reply all
Reply to author
Forward
0 new messages