谷歌MyMaps地理定位// GPS

Question

我在MyMaps中创建了一个地图，并将其实现为php文档。它运行良好。但我希望在启动时设置地理位置。这有可能吗？下面的脚本显示了一个带有地理位置的Google地图。我如何在这里实现我的地图？感谢您的帮助！

 <script>
    function initialize(coords) 
    {
        var latlng = new google.maps.LatLng(coords.latitude, coords.longitude);
        var myOptions = 
        {
            zoom: 8,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("pos"), myOptions);

        var marker = new google.maps.Marker(
        {
            position: latlng, 
            map: map, 
            title: "Hier bist du :)"
        }); 
    }
    navigator.geolocation.getCurrentPosition(function(position)
    { 
        initialize(position.coords);
    }, function()
    {
        document.getElementById('pos').innerHTML = 'Deine Position konnte leider nicht ermittelt werden';
    });
</script>

Answer 1

这是你应该实现的代码：

<script >
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>

SOURCE

Answer 2

将嵌入的地图iframe

1. Add到您的HTML中。

有关更多信息，请查看My Maps Documentation。

<iframe id="map-iframe" src="https://www.google.com/maps/d/u/2/embed?mid=YOUR_MAP_ID" width="640" height="480"></iframe>

1. 使用JavaScript文件中的地理位置来获取用户的当前Use

1. 和将地图设置为显示用户的位置，方法是在地图的&ll=lat,long末尾添加&ll=lat,long。

      // getting user's current location.
      navigator.geolocation.getCurrentPosition(
        (position) => {
          const pos = {
            lat: position.coords.latitude,
            lng: position.coords.longitude,
          };
          console.log(pos);

      // setting the map to show user's current location.
          document.getElementById('map-iframe').src = mapUrl.concat('&z=16&ll=', position.coords.latitude, ',', position.coords.longitude);

          console.log(document.getElementById('map-iframe').src);
        });
    } else {
      alert('Error: Your browser doesn't support geolocation.');
    }
  }