Google地图询问位置是否正常，但没有居中显示地图

我正在从我的地图加载我的地图以及从FusionTable中拉出的标记。如果他们接受请求，我现在试图围绕用户位置周围的地图居中。Google地图询问位置是否正常，但没有居中显示地图

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

我的代码：

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);

来源

2017-06-01 Simon Cooper

任何机会提供一个jsfiddle与虚拟数据？ –

你好@John从哪里获得虚拟数据？ –

刚刚来自FusionTable的数据，我们可以看到地图的工作和从那里调试 –

你需要改变：

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 - 添加回至查看）

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

来源

2017-06-01 11:08:25

宾果！那就是诀窍。谢谢。 –

Google地图询问位置是否正常，但没有居中显示地图

回答

相关问题