javascript - 谷歌地图可以询问位置，但没有将 map 居中

Question

我正在加载我的地​​图以及从 FusionTable 中提取的标记。如果用户接受请求，我现在尝试将 map 以用户位置为中心。

加载页面时，浏览器要求访问我的位置，我同意，但 map 并未以我的位置为中心。我也有搜索地址功能，但不认为这会影响事情。

我的代码:

function initMap() {

    var coords = new google.maps.MVCObject();
    coords.set('latlng', new google.maps.LatLng(51.525, -0.1));

    if (navigator.geolocation) {
     navigator.geolocation.getCurrentPosition(success);
    }

    //set new value for coords
    function success(position) {
     coords.set('latlng',
         new google.maps.LatLng(position.coords.latitude,
             position.coords.longitude));
           }

    var defaultZoom = 13;
    var tableId = '#############';
    var locationColumn = 'Location';
    var geocoder = new google.maps.Geocoder();
    var styles = [
    ...
];

    var map = new google.maps.Map(document.getElementById('map'), {
      center: coords.get('latlng'),
      zoom: defaultZoom,
      styles: styles
    });


    var layer = new google.maps.FusionTablesLayer({
      query: {
        select: locationColumn,
        from: tableId
      },
      options: {
        styleId: 2,
        templateId: 2
      },
      map: map
    });

    var zoomToAddress = function() {
      var address = document.getElementById('address').value;
      geocoder.geocode({
        address: address
      }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          map.setCenter(results[0].geometry.location);
          map.setZoom(16);

          // OPTIONAL: run spatial query to find results within bounds.
          var sw = map.getBounds().getSouthWest();
          var ne = map.getBounds().getNorthEast();
          var where = 'ST_INTERSECTS(' + locationColumn +
              ', RECTANGLE(LATLNG' + sw + ', LATLNG' + ne + '))';
          layer.setOptions({
            query: {
              select: locationColumn,
              from: tableId,
              where: where
            }
          });
        } else {
          window.alert('Address could not be geocoded: ' + status);
        }
      });
    };

    google.maps.event.addDomListener(document.getElementById('search'),
        'click', zoomToAddress);
    google.maps.event.addDomListener(window, 'keypress', function(e) {
      if (e.keyCode == 13) {
        zoomToAddress();
      }
    });
    google.maps.event.addDomListener(document.getElementById('reset'),
        'click', function() {
          map.setCenter(defaultCenter);
          map.setZoom(defaultZoom);
          layer.setOptions({
            query: {
              select: locationColumn,
              from: tableId
            }
          });
        });
  }

  google.maps.event.addDomListener(window, 'load', initialize);

Answer 1

您需要更改:

if (navigator.geolocation) {        
    navigator.geolocation.getCurrentPosition(success);
}

//set new value for coords
function success(position) {
    coords.set('latlng', new google.maps.LatLng(position.coords.latitude,
    position.coords.longitude));
}

致:

if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(function(position) {
      coords = {
        lat: position.coords.latitude,
        lng: position.coords.longitude
      };
      map.setCenter(coords);
    });
  } else {
    // Browser doesn't support Geolocation   
    //since you set coords above this section it will default to that      
  }

工作 JS(我删除了您的 fusiontableID - 将其添加回 View 中)

https://jsfiddle.net/cmjcs5eL/6/