GoogleマップのカスタムマーカーRetinaの解像度

Question

私はhtml5でiPhoneアプリを開発しており、Phonegapでビルドを行っています。次のように アプリでカスタムマーカーでGoogleマップがあります、マーカーアイコンが作成されている方法は、次のとおりです。アイコンのの

var image = new google.maps.MarkerImage("hat.png", null, null, null, new google.maps.Size(20,30)); 
var shadow = new google.maps.MarkerImage("shadow.png", null, null, null, new google.maps.Size(20,30)); 

var marker = new google.maps.Marker({ 
       map: map, 
       position: latlng, 
       index: markers.length, 
       icon: image,      
       shadow: shadow, 
       animation: google.maps.Animation.DROP, 
       html: htmlContent             
      }); 

実際のサイズは、コード内で定義されたサイズに比べて倍のサイズです。これは、アイコンが網膜ディスプレイ上に高解像度で表示されることを確認するために行われます。 上記のコードは今日までうまくいきましたが、今は次のようになります。

google.maps.Animation.DROPを使用してアイコンをドロップすると、途中でアイコンが高解像度で表示されますが、地図上にアイコンが「上陸」すると、アイコンは低解像度に切り替わります解像度バージョン。

誰も同じことを経験したことがありますか？

http://maps.googleapis.com/maps/api/js?v=3.0 

だから私はそれが最新のGoolgeマップのAPIのバグだと思う：

は...私はなどのGoogleマップのバージョンを指定した場合ことが判明

UPDATE 、ありがとうございました。

Answer 1

この問題もあります。バグはAPIの最新バージョン（v3.7）にあるように見えるので、URLパラメータ？v = 3.6でv3.6を指定するとうまくいきます。

更新：バージョン3.8+では、網膜画像を使用している場合は、最適化された：falseを使用して強制的に強制的に使用することができます。これは、最適化された：trueはすべてのスプライトを取り、それらをまとめてマスタースプライトにします。これは、マーカーが非常に少ない場合にのみ行うべきであることを意味します。また、Clustererではうまく動作しません。

デフォルトは現在最適化されています：true、これは、デバイスが高解像度のマスタースプライトを作成する前に非常に多くの高解像度アイコンのレンダリングを処理できるかどうかを最初に判断します。たとえば、網膜のMacBook Proに多くのマーカーを付けたマップをロードすると、高解像度で表示されますが、iPhone 4を試してみるとそうはなりません。あなたが最適化：偽を使用してiPhone 4を強制し、多くのマーカを持っていると、それは多くの文字を詰まらせる可能性があります。 4Sについてはわかりませんが、より高い処理能力を備えているため、おそらく高解像度版を使用すると思います。

Answer 2

低解像度にアイコンを切り替えると、map apiがカンバスを使用してアイコンをレンダリングしていることがわかります。だから、技術的にはバグではありませんが、それはバギー物事が（古いすなわちのような）特定のブラウザで発生させない

しかし、あなたはoptimized: false

var marker = new google.maps.Marker({ 
      map: map, 
      position: latlng, 
      icon: image,      
      shadow: shadow, 
      optimized: false            
     }); 

Answer 3

を使用して MarkerOptionsにオフにするために使用できる設定があります

sizeの代わりにscaledSizeを使用して画像の幅と高さを定義することで、私の解決策を見つけました。https://developers.google.com/maps/documentation/javascript/3.exp/reference#Icon

Answer 4

スケーリングSizeプロパティは正しいここでは、Googleが参照として使用するためのものです80px PNG。

Answer 5

は単にurl、sizeでオブジェクトを使用して、scaledSize属性：

var icon = { 
    url: 'path/img/marker@2x.png', 
    size: new google.maps.Size(30, 40), 
    scaledSize: new google.maps.Size(30, 40) 
}; 

path/img/marker@2x.pngが60px xは