Google Maps API 3 overlay, need to get the projection

I'm trying to do an overlay on Google Maps. I have generated tiles of my image using maptiler, but the example generated by maptiler is in v2 and i want to use v3. The example generated by maptiler is also very complex and does some unnecessary opacity stuff. Now v3 of GM has changed a lot since v2 and i have some problems to generate the LatLng of a certain point on the screen. getProjection() keeps being undefined, whatever i do, any idea how to get the projection?

<script> 
  var mapBounds = new google.maps.LatLngBounds();
  var mapMinZoom = 8;
  var mapMaxZoom = 14;
  var overlay;

  var maptiler = new google.maps.ImageMapType({
    getTileUrl: function(coord, zoom) {
          if ((zoom < mapMinZoom) || (zoom > mapMaxZoom)) {
        return "none.png";
      } 
      var ymax = 1 << zoom;
      var y = ymax - coord.y -1;
      var tileBounds = new google.maps.LatLngBounds(
        overlay.getProjection().fromDivPixelToLatLng( new google.maps.Point( (coord.x)*256, (coord.y+1)*256 ) , zoom ),
        overlay.getProjection().fromDivPixelToLatLng(开发者_JS百科 new google.maps.Point( (coord.x+1)*256, (coord.y)*256 ) , zoom )
      );
      if (mapBounds.intersects(tileBounds)) {
        return "" + zoom + "/" + coord.x + "/" + (Math.pow(2,zoom)-coord.y-1) + ".png";
      } else {
       return "none.png";
      }
   },
   tileSize: new google.maps.Size(256, 256),
   isPng: true
  });

  var map;
  function initialize() {
    map = new google.maps.Map(document.getElementById("map_canvas"));
    map.setZoom(11);
    map.setMapTypeId('satellite');
    mapBounds.extend(new google.maps.LatLng(50.9388615939, 3.80480816501));
    mapBounds.extend(new google.maps.LatLng(51.4402541425, 4.73612507791));
    map.fitBounds(mapBounds);

    overlay = new google.maps.OverlayView();
    overlay.draw = function() {};
    overlay.setMap(map);

    map.overlayMapTypes.insertAt(0, maptiler);
  }
</script> 

the overlay part is a hack i found on the internet which supposed to get you to the projection. unfortunately it didn't work. Any idea's how to fix this? in V2 you could do something like this:

var mercator = new GMercatorProjection()
mercator.fromPixelToLatLng( new GPoint( (tile.x)*256, (tile.y+1)*256 ) , zoom )

But this isn't possible anymore in v3.

Anyone that can help?

The example generated by maptiler can be found here:

http://gmapsexample.staging1.kunstmaan.be/googlemapsv2.html

This is a simple example in v3 which works:

http://gmapsexample.staging1.kunstmaan.be/googlemapsv3_simple.html

but i want everything except the map to be a specific color, so this is the example i'm trying to get working:

http://gmapsexample.staging1.kunstmaan.be/googlemapsv3.html

thanks,

Daan

---

You do not need to worry about getting or setting the projection if you are using MapTiler

These two YouTube videos will walk you through (among other things) using MapTiler with Google Maps API v3 map styled to be a certain color which is (if I understand correctly) exactly what you're asking about:

• http://www.youtube.com/watch?v=CeSFUSZLeao
• http://www.youtube.com/watch?v=WqSOLca2xOc

---

Try this as your Mercator function:

function GMercatorProjection() {
  this.pixelOrigin_ = new google.maps.Point(tileSize / 2, tileSize / 2);
  this.pixelsPerLonDegree_ = tileSize / 360;
  this.pixelsPerLonRadian_ = tileSize / (2 * Math.PI)
}

---

Check the documentation about custom overlays in API3 https://code.google.com/apis/maps/documentation/javascript/overlays.html#CustomOverlays