谷歌的地方阿比PlaceDetails(Google place Api PlaceDetails)

2019-10-17 06:27发布

嗨下面的代码给出了地方搜索,但它显示我想在下面的代码infobox..the通过DR.Molle isprovided地方的完整细节唯一名称

http://jsfiddle.net/doktormolle/C5ZtK/

下面是提取placedetails但不能使它工作的代码

 var request = { reference: place.reference };
    service.getDetails(request, function(details, status) {
      google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent(details.name + "<br />" + details.formatted_address +"<br />" + details.website + "<br />" + details.rating + "<br />" + details.formatted_phone_number);
        infowindow.open(map, this);
      });
    });
  }

我检查了开发者页面,但不能从中获得太多的任何帮助将不胜感激

Answer 1:

例子将获取点击标记的地点的详细信息:

http://www.geocodezip.com/v3_GoogleEx_place-search_starbucks3.html

代码片段:

 var geocoder = null; var map; var service; var infowindow; var gmarkers = []; var bounds = null; function initialize() { geocoder = new google.maps.Geocoder(); 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 }); geocoder.geocode({ 'address': "Seattle, WA" }, function(results, status) { if (status == google.maps.GeocoderStatus.OK) { var point = results[0].geometry.location; bounds = results[0].geometry.viewport; var rectangle = new google.maps.Rectangle({ bounds: bounds, fillColor: "#FF0000", fillOpacity: 0.4, strokeColor: "#0000FF", strokeWeigth: 2, strokeOpacity: 0.9, map: map }); map.fitBounds(bounds); var request = { bounds: bounds, name: "starbucks", types: ['establishment'] }; infowindow = new google.maps.InfoWindow(); service = new google.maps.places.PlacesService(map); service.search(request, callback); } else { alert("Geocode was not successful for the following reason: " + status); } }); } 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 }); var request = { reference: place.reference }; google.maps.event.addListener(marker, 'click', function() { service.getDetails(request, function(place, status) { if (status == google.maps.places.PlacesServiceStatus.OK) { var contentStr = '<h5>' + place.name + '</h5><p>' + place.formatted_address; if (!!place.formatted_phone_number) contentStr += '<br>' + place.formatted_phone_number; if (!!place.website) contentStr += '<br><a target="_blank" href="' + place.website + '">' + place.website + '</a>'; contentStr += '<br>' + place.types + '</p>'; infowindow.setContent(contentStr); infowindow.open(map, marker); } }); }); gmarkers.push(marker); var side_bar_html = "<a href='javascript:google.maps.event.trigger(gmarkers[" + parseInt(gmarkers.length - 1) + "],\"click\");'>" + place.name + "</a><br>"; document.getElementById('side_bar').innerHTML += side_bar_html; } function openInfoWindow(id) { return true; } google.maps.event.addDomListener(window, 'load', initialize); 
 #map { height: 400px; width: 600px; border: 1px solid #333; margin-top: 0.6em; } 
 <script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script> <table border="1"> <tr> <td> <div id="map"></div> </td> <td> <div id="side_bar"></div> </td> </tr> </table> 



文章来源: Google place Api PlaceDetails