Question

我在选择下拉更改上有以下 Ajax请求，它只是从控制器获取记录，遍历每个记录并获取latitude | longitude和将其推送到数组。

然后在相同的ajax成功中，我将该lat和lng数组传递给谷歌地图。

但地图没有显示。。

$(document).ready(function() {
   $('.selectCity').change(function() {
    var city = $(this).val();
    $.ajax({
      type: 'GET',
      url: '/riders/location/track',
      data: {
        'city': city
      },
      success: function(data) {
        var lat = [];
        var lng = [];

        //Get Locations and push it to lat and lng
        $.each(data, function(index, value) {
          $.each(value, function(index1, value1) {
            console.log(value1.rider_location.lat);
            lat.push(value1.rider_location.lat);
            lng.push(value1.rider_location.lng);
          });
        });

        //Google Map
        google.maps.event.addDomListener(window, 'load', init);

        function init() {

          var locations = [
            ['Rider', lat, lng]
          ];

          var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 10,
            center: new google.maps.LatLng(lat, lng),
            mapTypeId: google.maps.MapTypeId.ROADMAP
          });
          var infowindow = new google.maps.InfoWindow();
          var marker, i;
          for (i = 0; i < locations.length; i++) {
            marker = new google.maps.Marker({
              position: new google.maps.LatLng(locations[i][1], locations[i][2]),
              map: map
            });
            google.maps.event.addListener(marker, 'click', (function(marker, i) {
              return function() {
                infowindow.setContent(locations[i][0]);
                infowindow.open(map, marker);
              }
            })(marker, i));
          }
        }
      }
    });
  });
});

另外请建议最佳实践。

Answer 1

当然，我可以将上述评论作为答案。

您还可以使用return Json(response) - 参数（HTML）收听script-url中的“google-maps-ready”-event：

callback

JS：

<script type="text/javascript"
  src="http://maps.googleapis.com/maps/api/js?libraries=geometry,places&callback=initialize">
</script>

希望它有所帮助！

谷歌地图上的ajax成功

1 个答案: