Google Map исчезает при удалении $ (window) .load ()

Question

HTML:

<div style="margin-left:25%">
  <div id="map" style="width: 1000px; height: 500px"></div>
</div>

JavaScript:

<script>      

  $(window).load(
    function(){

        var HoChiMinh = {lat: 10.7867246, lng: 106.6735853};
        var map = new google.maps.Map(document.getElementById('map'), {
          center: HoChiMinh,
          zoom: 13,
        });

    });

</script>

<script src="https://maps.googleapis.com/maps/api/js?key={{ env('GOOGLE_MAPS_API_KEY') }}"
        async defer></script>

Я не знаю, что на самом деле здесь делает.

Когда я удаляю строку $(window).load(), моя карта Google не загружалась. Экран ничего не возвращает, пока я не положу $(window).load() обратно, опять работает.

Мне нужно удалить $(window).load() для использования некоторых данных из пользовательского ввода внутри HTML-кода.

Спасибо!

Answer 1

Я до сих пор не совсем понимаю, что на самом деле $(window).load() здесь делает.

Но я только что нашел одно решение.Когда я помещаю &callback=initMap в

<script src="https://maps.googleapis.com/maps/api/js?key={{ env('GOOGLE_MAPS_API_KEY') }}&callback=initMap"async defer></script>

и определяю функцию () для функции initMap ().Оно работает!Теперь мой сайт может загрузить карту без $(window).load().