Загрузить маркеры Google Maps с помощью ajax

Question

Я хочу загрузить маркеры для карты Google через ajax с помощью моей собственной службы геолокации. Функциональность ajax поступает из jQuery. Мой код для загрузки маркеров являются следующими:

$(document).ready(function() { 

     var myLatlng = new google.maps.LatLng(49.47143, 11.107489999999984); 
     var mapOptions = { 
      zoom: 8, 
      center: myLatlng 
     }; 
     var map = new google.maps.Map(document.getElementById('googlemap'), mapOptions); 

     $.ajax({ 
      type: "GET", 
      url: "{{ path('jobs_ajax_get_geolocation') }}", 
      data: "addr="+encodeURI("{{ company.getAddress }}, {{ company.getZipCode }} {{ company.getCity }}"), 
      success: function(data) { 
       var marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(data.lat, data.long), 
        map: map, 
        title: 'test' 
       }); 
      } 
     }); 
    }); 

Картографических нагрузок с правильной инициализацией-местом, но ни одного маркеров не показываются. Есть результаты ajax, предоставляемые url ({{path ('jobs_ajax_get_geolocation')}}, это маршрут symfony).

Где моя ошибка? Благодаря!

Answer 1

Ваша проблема в неправильном объеме.

Вы указали var marker внутреннее определение функции. Вне функции она не будет существовать. Но вам это нужно во внешнем масштабе.

Попробуйте объявить его перед закрытием:

$(document).ready(function() { 

     var myLatlng = new google.maps.LatLng(49.47143, 11.107489999999984); 
     var mapOptions = { 
      zoom: 8, 
      center: myLatlng 
     }; 
     var map = new google.maps.Map(document.getElementById('googlemap'), mapOptions); 
     var marker; 

     $.ajax({ 
      type: "GET", 
      url: "{{ path('jobs_ajax_get_geolocation') }}", 
      data: "addr="+encodeURI("{{ company.getAddress }}, {{ company.getZipCode }} {{ company.getCity }}"), 
      success: function(data) { 
        marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(data.lat, data.long), 
        map: map, 
        title: 'test' 
       }); 
      } 
     }); 
    });