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

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

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

有人知道怎么了或可以帮助我吗?

提前致谢!

-更新-

我尝试从Google Maps文档(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);
 })();

最佳答案

在提供给getCurrentPosition()的回调中,您正在设置pos。但是,在电话确定位置后,即在将来的某个随机点,将调用此回调。您尝试在pos中的位置上使用该request很久之后。您需要将位置代码移至其自己的函数中,然后在将地图居中后在传递mappos的同时进行调用。几乎完全与addMarker()相同。

关于javascript - 附近的地方Google Maps Places API,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/41883253/

10-10 02:02