正確な問題を確認できるテスト ページを作成しました。
最初のクリックで完璧な地図が表示されますが、ポップアップを閉じてもう一度クリックするとgmap
、ポップアップが開きますが、gmap
4 分の 1 が表示されます。
正確な問題を確認できるテスト ページを作成しました。
最初のクリックで完璧な地図が表示されますが、ポップアップを閉じてもう一度クリックするとgmap
、ポップアップが開きますが、gmap
4 分の 1 が表示されます。
ユーザーがリンクInit()
をクリックするたびに電話をかけています。gmap
この関数は毎回 Google マップを作成します。
考えられる解決策は 2 つあります。
ユーザーが最初にダイアログを開いたときにのみマップを作成します。ユーザーがダイアログを閉じると、jQuery は実際にダイアログ div を非表示にします。マップはそこに残っているので、ダイアログを再表示するときに新しいマップを作成する必要はありません。(ユーザーが要素をクリックするたびに新しいマップを作成する前にvar map = null;
、グローバルに宣言し、map
等しいかどうかをテストします。null
gmap
ダイアログが閉じたときにマップ div をクリーンアップします。
ダイアログを閉じる際のクリーンアップ
map
ダイアログを閉じるときに要素を消去するには、次のコードを試してください。
<script type="text/javascript">
$('document').ready(function () {
$("#popup_container").dialog({
autoshow: false,
modal: true,
border: 10,
width: 500,
height: 340,
close: function(event, ui) {
$('#map').html('');
}
});
$('#gmap').click(function () {
Init(); // initialize the map
$("#popup_container").dialog("open");
});
});
</script>
dialog()
また、引数を単一のオブジェクトとしてメソッドに渡す必要があることに注意してください。