Google Maps APIバージョン3により、画像がぼやけている/ぼやけている

Question

Safari 5.1.5で何らかの理由でGoogle Mapsが画像の一部をぼかしています。たとえば、http://catpr.com/craig-chapman/とします。シャンデリアがロードされると、しばらくの間、シャープなレンダリングが実行された後、ぼやけて表示されます。私のコードから

<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?sensor=false"> </script> 

を削除

は、この出来事を停止します。これはSafariにのみ影響するように思われます。これはFirefoxやChromeでは発生しません。 Safariの古いバージョンはテストしていないので、バグかもしれません。また、キャッシュをクリアして、コンピュータを再起動してSafariを更新しましたが、変更はありませんでした。

アイデア？

ありがとうございました

Answer 1

私はSafariでバグを再現できません。ただし、2つの回避策が考えられます。

1. スクリプトを非同期に読み込みます。地図apiの基本的な入門ページをチェックして、非同期でAPIを読み込むセクションをご覧ください。

2. 代わりにGoogle静的地図画像を使用してみてください。これはJavaScriptの地図画像ではありません。 http://goo.gl/wY8lF。私は、あなたがGoogle Maps APIの動的機能を使用していないように見えるので、それをお勧めします。

Answer 2

この問題は、マップ自体とページ上のフォントでも発生しました。この問題を解決しようとすると、長い時間の後、これが私の結論です：

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?v=3.5&sensor=false"></script> 

（あなたと同じ）最初のものは私にぼやけマップを提供します。私がコメントしてバージョン3.5を強制すると、マップは鮮明で幸せです！

ウェブサイトのフォントのアンチエイリアスを変更するGoogle Maps APIにも問題がありました。私は私のメインstyle.cssにこの問題を解決するために管理：

* { 
    -webkit-font-smoothing: subpixel-antialiased !important; 
} 

私はこれがあなたまたは誰かに役立ちます願っています。 注：私は、Twitterのブートストラップフレームワークを使用しています。

Answer 3

この問題は現在、クロム（23ベータ版）に3.8と3.9 APIの違いを私のために発生しています。 3.9 APIを指定すると、分割された秒間にマップが正しく表示され、すべてがぼやけてしまいます。私が3.8 APIを指定すると、それは正常に機能します。

あなたがここで問題を見ることができます：

問題がhttp://melbourne.origami.org.auです。私は現在回避策として3.8 APIを設定していますが、v10が最終的にリリースされると、3.9が最も低い利用可能なAPIになる可能性が高くなります。

私は自分自身で、3.9と3.10を使って、GL合成時に-webkit-transformを使ってすべてをレンダリングするようにChromeを呼び出すように思われます。すべてのマップ要素に適用されます。これは恐ろしいものの原因となっているようです。