Динамическая подгрузка карты google map

225

12 августа 2017, 04:51

Всем доброго времени суток.
Есть задача подгрузить карту в зависимости от выбранной странны. Результат мойх попыпток таков. при первом выборе все работает как нужно. но при выборе след странны подгружаеться пустой блок. Не прошу решить задачу прошу лиш подсказать с логикой. Ибо смущает коллбек в API .

<!DOCTYPE html> 
<html> 
  <head> 
    <style> 
      #map { 
        height: 400px; 
        width: 100%; 
       } 
    </style> 
  </head> 
  <body> 
    <h3>My Google Maps Demo</h3> 
    <div id="map"></div> 
    <script> 
      function initMap() { 
        var uluru = {lat: -25.363, lng: 131.044}; 
        var map = new google.maps.Map(document.getElementById('map'), { 
          zoom: 4, 
          center: uluru 
        }); 
        var marker = new google.maps.Marker({ 
          position: uluru, 
          map: map 
        }); 
      } 
    </script> 
    <script async defer 
    src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"> 
    </script> 
  </body> 
</html>