javascript - 附近地点 Google map Places API

Question

首先，我刚刚开始接触 JavaScript，所以我不太擅长。我正在制作一个应用程序，使用 Google Maps Places API，您可以在其中按下一个按钮并获取您的位置，按下另一个按钮并根据您的位置获取附近的地点(例如商店或酒吧)。获取设备的位置有效，但我的代码不显示附近的位置。它确实会到达该位置，但不会显示附近地点的标记。我不知道出了什么问题，但我认为这可能与标记的代码或代码的顺序有关。

我正在使用 Intel XDK(HTML5 + Cordova 和 App Designer)和 Google Maps Places API。现在，当按下一个按钮(id =“myloc-btn”)时，这一切都会发生，但是(如果位置和附近的地方都工作)我想将它们分成两个按钮，一个用于显示位置，一个用于显示位置显示附近的地点。

下面是我的 JavaScript 代码。我已经注释掉了我最初拥有的设备位置的标记，因为我认为它可能妨碍了附近位置的标记。

有人知道出了什么问题或者可以帮助我吗？

提前致谢!

---更新---

我尝试从 Google map 文档 ( https://developers.google.com/maps/documentation/javascript/examples/place-search ) 中搜索附近的地点，并设置位置(我基本上复制并粘贴了代码)，但这也不起作用。它再次转到正确的位置，但不显示任何标记。我在模拟器和手机上都尝试过，但结果都是一样的。我不知道为什么标记不显示

var map;
var service;
var infoWindow;
var pos;
var marker = [];
//var labels = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
//var labelIndex = 0;

function register_event_handlers() {

$(document).on("click", "#myloc-btn", function(evt) {
    initMap();
});

 function initMap() {
    map = new google.maps.Map(document.getElementById('gmap'), {zoom: 14});

    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
      pos = {
            lat: position.coords.latitude, 
            lng: position.coords.longitude
      };
      //addMarker(pos, map);
      map.setCenter(pos);
     }, function() {
        handleLocationError(true, infoWindow, map.getCenter());
      });
     } else {
      // Browser doesn't support Geolocation
      handleLocationError(false, infoWindow, map.getCenter());
     }

     var request = {
        location: pos,
        radius: 5000,
        type: ['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 handleLocationError(browserHasGeolocation, infoWindow, pos) {
    infoWindow.setPosition(pos);
    infoWindow.setContent(browserHasGeolocation ?
                          'Error: The Geolocation service failed.' :
                          'Error: Your browser doesn\'t support geolocation.');
  }

 /*
 function addMarker(location, map) {
        var marker = new google.maps.Marker({
            map: map,
            // Define the place with a location, a query string and a label.
            place: {
                location: location,
                query: 'This is my location'
            },
            label: labels[labelIndex++ % labels.length],
        });

        // Construct a new InfoWindow.
        var infoWindow = new google.maps.InfoWindow({
            content: 'Here I am!'
        });

        // Opens the InfoWindow when marker is clicked.
        marker.addListener('click', function() {
            infoWindow.open(map, marker);
        }); 
 }
 */ 


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

 document.addEventListener("app.Ready", register_event_handlers, false);
 })();

Answer 1

在提供给 getCurrentPosition() 的回调中，您要设置 pos。但是，此回调将在手机确定位置之后(即 future 的某个随机点)被调用。在您尝试在地点的请求中使用该pos之后已经很久了。您需要将地点代码移动到其自己的函数中，然后在将 map 居中后，在传递 map 和 pos 时调用它。几乎与您使用 addMarker() 所做的一样。