如何在注册时使用 google 地图 api 在全球地图中自动显示注册用户的地理位置?

How can I show automatically registered users geolocation in a global map with google maps api as they register?

我正在尝试在地图中显示网站上所有用户的地理位置。通过 google 地图 API 文档,我有办法显示我作为用户的位置。但是,我如何才能显示网站上注册人员的所有地理位置?

<div id="map"></div>
<script>

  function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      center: {lat: -34.397, lng: 150.644},
      zoom: 6
    });
    var infoWindow = new google.maps.InfoWindow({map: map});

    // Try HTML5 geolocation.
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        var pos = {
          lat: position.coords.latitude,
          lng: position.coords.longitude
        };

        infoWindow.setPosition(pos);
        infoWindow.setContent('Location found.');
        map.setCenter(pos);
      }, function() {
        handleLocationError(true, infoWindow, map.getCenter());
      });
    } else {
      // Browser doesn't support Geolocation
      handleLocationError(false, infoWindow, map.getCenter());
    }
  }

  function handleLocationError(browserHasGeolocation, infoWindow, pos) {
    infoWindow.setPosition(pos);
    infoWindow.setContent(browserHasGeolocation ?
                          'Error: The Geolocation service failed.' :
                          'Error: Your browser doesn\'t support geolocation.');
  }
</script>

创建 google.maps.Marker() 类型的对象,使用其 setPosition 函数设置位置并使用 setMap 函数将其添加到您的地图。

示例(Lat/Lng 是德国的中心 - 在此处插入您的用户坐标):

var marker=new google.maps.Marker();  
// use your registered user coordinates here
marker.setPosition(new google.maps.LatLng(48.14544, 8.19208)); 
marker.setMap(map);

此外,您可以使用边界让地图自动缩放,让每个标记都可见:

var bounds=new google.maps.LatLngBounds();
...
bounds.extend(marker.getPosition());
...
map.fitBounds(bounds);