javascript - 如何在谷歌地图和 Ajax 中使用分页

问题描述

由于大量数据，我有一个分页的 api。现在我正在尝试使用 API 从数据库中获取 lat 和 lng 的谷歌地图。我仍然只得到 API 数据的第一页。我的代码有什么问题？我应该改变什么。请帮忙。我会很高兴你。

你好。由于大量数据，我有一个分页的 api。现在我正在尝试使用 API 从数据库中获取 lat 和 lng 的谷歌地图。我仍然只得到 API 数据的第一页。我的代码有什么问题？我应该改变什么。请帮忙。我会很高兴你。

<script>
  function initMap(map) {
    var start_point = new google.maps.LatLng(27.772321, 1.803125);

    // Creating a new map
    var map = new google.maps.Map(document.getElementById("companies-map"), {
      center: start_point,
      zoom: 2,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });

    function setMarkerPoints(map) {
      var bounds = new google.maps.LatLngBounds();
      var mc = [];
      var infoWindow = new google.maps.InfoWindow();

      url = '/api/companies/map/',
        $.ajax({
          type: "GET",
          url: url,
          dataType: "json",
          success: function(data, pagination) {
            $.each(data.results, function(marker, data) {
              var latLng = new google.maps.LatLng(data.point.latitude, data.point.longitude);

              bounds.extend(latLng);

              // Creating a marker and putting it on the map
              var marker = new google.maps.Marker({
                position: latLng,
                animation: google.maps.Animation.DROP,
                map: map,

              });

              google.maps.event.addListener(marker, 'click', function() {
                infoWindow.setContent('<a href="' + data.title + '" class="text-primary hover-dark">' + data.name + '</a><br>' + data.name);
                infoWindow.open(map, marker);
              });

              mc.push(marker);
            });

            if (pagination.hasNextPage) {
              pagination.nextPage();
            };

            new MarkerClusterer(map, mc, {
              imagePath: 'https://developers.google.com/maps/documentation/javascript/examples/markerclusterer/m'
            });
          },
          error: function(data) {
            console.log('Please refresh the page and try again');
          }
        });

      //END MARKER DATA

      // end loop through json
    }
    setMarkerPoints(map);
  }
  google.maps.event.addDomListener(window, 'load', renderGoogleMap);
  renderGoogleMap();
</script>

太感谢了

标签： javascriptgoogle-mapspagination

javascript - 如何在谷歌地图和 Ajax 中使用分页

问题描述

解决方案

推荐阅读