ウィンドウがサイズ変更されるまでブートストラップモードで読み込むgoogleマップを取得できません

Question

ページがリサイズされるまで灰色で表示されますが、通常はコンソールウィンドウを開いてマップを閉じます。それは

Googleは

私はGoogleマップのトリガーを追加するなどの複数の方法を試してみました、

google.maps.event.trigger(map{{ $article->id }}, 'load'); 

をマッピングし、単一ページのaswellの複数のマップがある、などまだ色のまま0

そして、すべてのヘルプははるかになり

、すべての記事マップをロードするためにforeachループでそれを実行するモーダルウィンドウ

$('a[href="#view-article-modal{{ $article->id }}"]').on('shown.bs.modal', function(e){ 
    initAutocomplete(); 
}); 

を開くには、アンカーに機能を初期化するには、感謝を感謝しています。

Answer 1

Bootstrap's Modal Eventsを使用してモーダルが開いたときにresize()関数を実行してみてください。

$('#myModal').on('shown.bs.modal', (e) => { 
    this.resizeMap(); 
}) 

resizeMap() { 
    var map = new google.maps.Map(document.getElementById('map'), this.options); 
    google.maps.event.trigger(map, "resize"); 
}