Google Maps API for Javascript V3にタイルスタイルを強制する

Question

Google Maps JS API V3を使用するWordpressのマッププラグインを作成しています。一般的に地図は、スタイリングされた画像を持つワードプレスの投稿に埋め込まれます。これは実際に最も人気のあるテーマTwentyElevenの1つで発生します。これがGoogleマップのための手段は何

.entry-content img, 
.comment-content img, 
.widget img { 
max-width: 97.5%; /* Fluid images for posts, comments, and widgets */ 
} 

マップタイルは、のように見える終わるということで、このです：

このはトン、約ない掲載されていますが、人々が対処しなければなりませんでしたそれと。だから私はこれを研究している。

http://wordpress.org/support/topic/twenty-eleven-12-breaks-embedded-google-maps

http://wpscale.com/google-street-map-cant-work-in-wordpress-3-2/

私はこのテーマで見てきたすべてのポストを使用しているのdivのクラスのスタイリングを変更するソリューションを提供します：

.wl_places_place_map_canvas img { 
max-width: none; 
} 

これは良く見える、それは本当にありません。私はそれを見栄えさせる解決策を見いだすつもりはありません。この解決策には、望ましくない2つの効果があります。

1. スタイリングのオーバーライドが実際には機能しない場合があります。
2. 目に見える1pxのタイルギャッピングは、タイルライン上にある場合に実際にマーカーオーバーレイを隙間を空けて表示します。

   google.maps.event.trigger(_instance._map, 'resize'); 
   var listener = google.maps.event.addListener(_instance._map, "tilesloaded", function() { 
   jQuery('.wl_places_place_map_canvas').find('img').css('max-width','none'); 
   google.maps.event.removeListener(listener);   
   }); 
   

   最初を扱う：私はjQueryのを使用し、すべてのタイルが前にスタイルを設定するにロードされていることを確認しようとしてきたバックグラウンドにスタイルの問題に対処するための

2番目と1pxのタイルのギャップはまだマップ上に表示されず、オーバーレイされません。

私が欲しいのは、地図上にスタイルを強制する100％の防弾方法です。私は広範囲にAPIを研究しました。何が私は本当にのようにマップ自体のスタイルを設定する方法は、うまくいけば、URLとして、それは無視し、すべての外部スタイルをオーバーライドします。可能な限り最高の世界では、このスタイルはGoogleのCDNに収められ、埋め込まれた場所に関係なく常にきれいに見えるようにテストされます。

アイデア？

Answer 1

#map img {max-width：none！important; }を初期マップスタイルに変更します。これまで働いていたようだ。

Gravity FormsのHTMLフィールド内にマップを追加するまで、すべてWordPressでうまくいきました。なぜそれが失敗し始めたのかわからないが、上記のタイルの問題を修正した。