地理位置與PlacesServices

Question

我想要做的是找到我的當前位置與地理定位API，然後添加谷歌的地方，以顯示我周圍的東西。但是我到目前爲止只返回一個特定的位置...

<script> 
    var map; 
    var infowindow; 

    function initialize() { 
    var pyrmont = new google.maps.LatLng(-33.8665433, 151.1956316); 

    map = new google.maps.Map(document.getElementById('map'), { 
     mapTypeId: google.maps.MapTypeId.ROADMAP, 
     center: pyrmont, 
     zoom: 15 
    }); 

    var request = { 
     location: pyrmont, 
     radius: 500, 
     types: ['store'] 
    }; 
    infowindow = new google.maps.InfoWindow(); 
    var service = new google.maps.places.PlacesService(map); 
    service.nearbySearch(request, callback); 
    } 

    function callback(results, status) { 
    if (status == google.maps.places.PlacesServiceStatus.OK) { 
     for (var i = 0; i < results.length; i++) { 
     createMarker(results[i]); 
     } 
    } 
    } 

    function createMarker(place) { 
    var placeLoc = place.geometry.location; 
    var marker = new google.maps.Marker({ 
     map: map, 
     position: place.geometry.location 
    }); 

    google.maps.event.addListener(marker, 'click', function() { 
     infowindow.setContent(place.name); 
     infowindow.open(map, this); 
    }); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
</script> 

正如你可以看到皮爾蒙特 - 給我的緯度和長，但我想這個用戶的當前位置來代替。所以我可以找出他們在哪裏，然後給他們一些商店。當我嘗試這樣做時，我一直畫空白。我之前做過地理位置：

new google.maps.LatLng(position.coords.latitude, position.coords.longitude); 

但是，如果我在lat long節中使用此var，我會得到一個愛情錯誤。感謝您提前提供任何幫助。

Answer 1

好吧，這做到了：

<script> 
var map; 

      function initialize() { 
        var mapOptions = { 
           
        }; 
        map = new google.maps.Map(document.getElementById('contact-map'),{ 
    zoom: 15, 
    mapTypeId: google.maps.MapTypeId.ROADMAP    
        }); 

        // Try HTML5 geolocation 
        if(navigator.geolocation) { 
          navigator.geolocation.getCurrentPosition(function(position) { 
            var pos = new google.maps.LatLng(position.coords.latitude, 
                                             position.coords.longitude); 

            var request = { 
          location: pos, 
          radius: 500, 
          types: ['store'] 
        }; 
             
            var marker = new google.maps.MarkerImage('../img/layout/marker.png'); 
             
            var infowindow = new google.maps.InfoWindow({ 
              map: map, 
              position: pos, 
              icon: marker, 
              content: 'youre here' 
            }); 
            var service = new google.maps.places.PlacesService(map); 
            service.nearbySearch(request, callback);             
             
            function callback(results, status) { 
        if (status == google.maps.places.PlacesServiceStatus.OK) { 
          for (var i = 0; i < results.length; i++) { 
            createMarker(results[i]); 
          } 
        } 
      } 
       
      function createMarker(place) { 
        var placeLoc = place.geometry.location; 
        var marker = new google.maps.Marker({ 
          map: map, 
          position: place.geometry.location 
        }); 
      google.maps.event.addListener(marker, 'click', function() { 
      infowindow.setContent(place.name); 
      infowindow.open(map, this); 
  }); 
  } 
             
            map.setCenter(pos); 
          }, function() { 
            handleNoGeolocation(true); 
          }); 
        } else { 
          // Browser doesn't support Geolocation 
          handleNoGeolocation(false); 
        } 
      } 

      function handleNoGeolocation(errorFlag) { 
        if (errorFlag) { 
          var content = 'Error: The Geolocation service failed.'; 
        } else { 
          var content = 'Error: Your browser doesn\'t support geolocation.'; 
        } 

        var options = { 
          map: map, 
          position: new google.maps.LatLng(60, 105), 
          content: content 
        }; 

        var infowindow = new google.maps.InfoWindow(options); 
        map.setCenter(options.position); 
      } 

      google.maps.event.addDomListener(window, 'load', initialize); 
    </script>