Попытка вызвать глобальную переменную в функцию Google Maps

Question

,,,<script>


var eventlong;
var eventlat;

$('#eventreg').on('show.bs.modal', 


                 function (event) {
  var button = $(event.relatedTarget) // Button that triggered the modal
  var eventtitle = button.data('eventtitle')
  var eventdate = button.data('eventdate')
  var eventtime = button.data('eventtime')
  var eventtype = button.data('eventtype')
  var eventlong = button.data('eventlong')
  var eventlat  = button.data('eventlat')


  modal.find('#eventtitle').text(eventtitle)
 modal.find('#eventtype').text(eventtype)

})

    </script>
 <script>

      function initMap() {
          var latm = eventlat;
      var lngm = eventlong;
        map = new google.maps.Map(document.getElementById('map'), {
          center: {lat: 'latm',lng: 'lngm'},
          zoom: 8
        });
      }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"
    async defer></script>   </script>
,,,

Привет в приведенном выше коде я использую bootstrap и data- *, чтобы предварительно заполнить переменные для представления в модальном. Быть парнем, который всегда хочет сделать еще один шаг вперед. Я объявил две переменные как глобальные '' 'eventlong' '' и '' '' eventlat '' '(они числовые c) Long и значения Lat, которые я пытаюсь включить в вызов API карт Google. Я удалил свой ключ API, чтобы защитить невинных. Но я не могу понять это. любое руководство было бы замечательно.

Спасибо.