javascript google map api и http://ip-api.com/json не работает начинающий кодер, имеющий проблемы

Question

это мой код, а lat: и lng: show not defined. Когда я смотрю в консоли Chrome chrome, я также вижу ошибку, что initMap не является функцией.

<script> 

    $(document).ready(function(){ 
    var latitude; 
    var longitude; 
    $.getJSON("http://ip-api.com/json",function(data){ 
     latitude=data.lat 
     longitude=data.lon 
    var lati=parseFloat(latitude); 
    var long=parseFloat(longitude);  
       function initMap() { 
     map = new google.maps.Map(document.getElementById('map'), { 
      center: { 
       lat: lati 
       , lng: long 

      } 
      , zoom: 8 

     }); 
      } 

    }); 
    }); 


</script> 

карта вызова

<script src="https://maps.googleapis.com/maps/api/js?key=------removed--------&callback=initMap" async defer></script>  

Answer 1

Ваша функция initMap будет вызываться, когда API Карт готов. Функция обратного вызова завершается внутри вашего обратного вызова getJSON и будет выходить за пределы области действия при вызове API.