Googleマップのサイズを変更するapi v3 jquery-tileが適切にリフレッシュされていない

Question

Google Maps api v3を使用して、サイズ変更可能なマップを作成しています（divはjQueryトグルを使用して展開および縮小されます）。研究を通して私はgoogle.maps.event.trigger（map、 'resize'）を呼び出す必要があることを発見しました。地図のサイズを変更するとき。私はそうしましたが、私はまだタイルが爽やかに問題を抱えています。

私が使用していたコードは次のとおりです。

<script> 
document.write('<a id="expandMap" href="#" target="_blank" title="Expand the map">+ expand map</a>'); 

/* Expand map_canvas DIV */ 

jQuery('#expandMap').toggle(function(){ 
jQuery('a#expandMap').text('- contract map'); 
jQuery('a#expandMap').attr('title', 'Contract the map'); 
jQuery('#map_canvas').animate({'height': '600px'}, 750, 'swing'); 
google.maps.event.trigger(map, 'resize'); 
}, function(){ 
jQuery('a#expandMap').text('+ expand map'); 
jQuery('a#expandMap').attr('title', 'Expand the map'); 
jQuery('#map_canvas').animate({'height': '193px'}, 750, 'swing'); 
google.maps.event.trigger(map, 'resize'); 
}); 

/* Expand map_canvas DIV End */ 
</script> 

誰もが任意のアイデアを提案することはできますか？展開すると、契約ボタンをクリックすると、すべてのタイルが適切に表示されるフラッシュが表示されるので、収縮時にサイズ変更イベントがトリガーされるように見えます。契約された状態では、マップは完全に機能します。すべてのタイルの周りをパニングする必要があります。

本当にありがとうございます！

乾杯！

Answer 1

animate()に時間がかかります。

あなたはアニメーションが完了し、少なくともときマップのサイズ変更イベントをトリガする必要があります（さらに、あなたが各ステップでそれを引き起こす可能性）、ではない、それは恐ろしい