在 AJAX 请求完成之前加载 Google 地图

Question

我正在使用 Google Maps API 和 rails 5.0.4。

我希望地图以用户位置为中心，并用坐标填充纬度、经度字段。目前，lat, lng 字段填充正确，但地图在异步调用完成之前加载，导致地图位置与坐标不匹配。它确实在刷新后自行修复，但在第一次加载时，异步是一个问题。我试图用一个承诺来设置它，但无法让它发挥作用。

最好的方法是什么？

$(document).ready(function(){

      function getUserCoordinates() {
        if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(setCoords);
        };
      };

      function setCoords(position) {
        lat = position.coords.latitude;
        lng = position.coords.longitude;
        updateUserLat(lat);
        updateUserLng(lng);
        document.getElementById("latitude").value = lat.toFixed(6);
        document.getElementById("longitude").value = lng.toFixed(6);
      };

      function updateUserLat(lat) {
        $.ajax({
          type: 'PATCH',
          url: '/users/:id',
          data: {'user[latitude]': lat}
        });
      };
      function updateUserLng(lng) {
        $.ajax({
          type: 'PATCH',
          url: '/users/:id',
          data: {'user[longitude]': lng}
        });
      };

      getUserCoordinates();

      function initMap(){
          initialize();
      };

});

Answer 1

从文档就绪包装器中移动 initMap() 函数。设置纬度/经度后直接调用 initMap。

将它放在文档就绪包装器中将在页面加载时调用以初始化地图，这是您不想要的。