googlemapapiのGroundOverlayをiPhoneで使うときの注意点

今日から新年度ということですが相変わらずダメ人間のまま今年度も乗り切ろうと思います。

それで今googlemapapiでGroundOverlayを使ってある画像をおいてるんだけども、
PCで見たら表示されるのにiPhoneだと表示されなかったのです。

ソースはこんなの。

function initialize() {
  var initLatLng = new google.maps.LatLng(緯度, 経度);
  var mapOptions = {
    center: initLatLng,
    mapTypeControl: false,
    streetViewControl: false,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };

  map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

  var sw = new google.maps.LatLng(緯度, 経度);
  var ne = new google.maps.LatLng(緯度, 経度);
  var imageBounds = new google.maps.LatLngBounds(sw, ne);

  var mapOverlay = new google.maps.GroundOverlay(
    "/img/hoge.png",
    imageBounds
  );
  mapOverlay.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

よくありがちなソースですね。

で、このhoge.pngがiPhoneだと表示されないという現象に悩まされました。
最初は画像のファイル容量だと思って100kbから50kbにしたけどそれでも表示されない。
じゃあpngが悪いのかと思ってjpgやgifにしたけどそうでもないし、そもそもpngのせいじゃない。

で、あーだこーだしているうちに結局画像サイズが原因だと判明しました。
最初は2000px以上の画像サイズを使っていたんだけど、それを1900pxにすると無事に表示されるようになりました。

時間がないのでとりあえずこれでよしとするけど本当の原因て何なんだろうか。
もしかするとドキュメントに載っているのかもしれないけどね。