Question

我有以下代码：

map = new google.maps.Map(document.getElementById('map-canvas'), {
    zoom: 13,
    center: new google.maps.LatLng(53.529773,-113.509387), 
    mapTypeId: google.maps.MapTypeId.ROADMAP
});

如何更换：

center: new google.maps.LatLng(53.529773,-113.509387)

以我的当前位置，以编程方式

Answer 1

您的代码看起来是正确的，我怀疑您的问题是您的设备没有启用位置服务，如果是，您可能在第一次运行时不接受安全提示。

以下演示我从google maps API参考中修改过 https://developers.google.com/maps/documentation/javascript/

HTML演示

<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer
        src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap">
</script>

CSS

/* Always set the map height explicitly to define the size of the div
 * element that contains the map. */
#map {
  height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

JS

function initMap() {

  // Pick a start point, I live in Australia, so just picked the middle of OZ
  var myLatLng = {lat: -25.363, lng: 131.044};

  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: myLatLng
  });

  // Mark it on the map, this is the original center
  var marker = new google.maps.Marker({
    position: myLatLng,
    map: map,
    title: 'Hello World!'
  });

  // If location services is enabled, the following should center the map on your location.
  if (navigator.geolocation) {
                navigator.geolocation.getCurrentPosition(function (position) {
            var location = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
            map.setCenter(location);
                });
  }
}

中心地图到我的位置

1 个答案: