谷歌地方图书馆没有地图 [英] google places library without map
问题描述
我正在尝试使用Google地方库提供附近的搜索请求：
https： //developers.google.com/maps/documentation/javascript/places#place_search_requests
我只想把json响应放到html中列表中，我现在想要在地图上显示结果或其他内容。我根本不想使用地图。但在文档中指出必须有地图
service = new google.maps.places.PlacesService（** map **）;
为了将它作为参数传递给PlacesService函数。我现在所做的是添加一个高度为0的地图，但它仍然消耗大量的内存（我开发了一个sencha touch 2应用程序，内存很重要）。在没有地图的情况下使用附近的搜索请求是否有任何解决方法？我不希望使用Google Places API，因为它不支持JSONP请求。
要么是一个地图，要么是一个节点，用于呈现结果的属性。所以你只需要使用节点（一个节点是请注意：隐藏属性违反了places-policies（当用作参数时也隐藏了地图，因为地图会显示归属地）
这也许对您有趣：谷歌地方的API这是否违反了目录？
< h3>示例：简而言之
如果您使用jQuery：
var service = new google.maps.places.PlacesService（$（'＃tag-id'）。get（0））;
如果使用纯Javascript：
var service = new google.maps.places.PlacesService（document.createElement（'div'））;
然后照常继续以及其他示例代码：
service.nearbySearch（request，callback）;
示例：使用返回的细节
注意：此示例使用 jQuery 。
< ul class =reviews__contentid =reviews__content>
< / ul>
< div id =service-helper>< / div>
< script async defer
src =https://maps.googleapis.com/maps/api/js?key=GOOGLE_API_KEY_HERE&libraries=places&callback=getRelevantGoogleReviews>
< / script>
< script type =text / javascript>
window.getRelevantGoogleReviews = function（）{
var service = new google.maps.places.PlacesService（$（'＃service-helper'）。get（0））; //注意，它删除了标签'＃service-helper'中的内容
service.getDetails（{
placeId：'ChIJAwEf5VFQqEcRollj8j_kqnE'// get a placeId using https：// developers.google.com/places/web-service/place-id
}，函数（地点，状态）{
if（status === google.maps.places.PlacesServiceStatus.OK）{
var resultcontent ='';
for（i = 0; i< place.reviews.length; ++ i）{
//window.alert('Name：'+ place.name +'。ID：'+ place.place_id +'。address：'+ place.formatted_address）;
resultcontent + ='< li class =reviews__item>'
resultcontent + ='< ; div class =reviews__review -er>'+ place.reviews [i] .author_name +'< / div>';
var reviewDate = new Date（place.reviews [i] .time * 1000 ）;
var reviewDateMM = reviewDate.getMonth（）+ 1;
var reviewDateFormatted = reviewDate.getDate（）+'/'+ reviewDateMM +'/'+ reviewDate.getFullYear（）;
resultcontent + ='< div class =reviews__review-date>'+ reviewDateFormatted +'< / div>';
resultcontent + ='< div class =reviews__review-rating reviews__review-rating--'+ place.reviews [i] .rating +'>< / div>';
if（!! place.reviews [i] .text）{
resultcontent + ='< div class =reviews__review-comment>'+ place.reviews [i] .text +' < / DIV>';
}
resultcontent + ='< / li>'
}
$（'＃reviews__content'）。append（resultcontent）;
}
}）;
}
< / script>
I am trying to use the google places library for a nearby search request: https://developers.google.com/maps/documentation/javascript/places#place_search_requests
i just want to pull the json response and put it in a html list, i do now want to show results on a map or something else. I do not want to use map at all. But in documentation it states that there has to be a map
service = new google.maps.places.PlacesService(**map**);
in order to pass it as an argument in the PlacesService function. What i do now is adding a map with height:0 but it still consumes much amount of memory (i develop a sencha touch 2 app and memory is important). Is there any workaround of using nearby search requests without a map? I do not want to use the Google Places API as it does not support JSONP requests.
As documented the PlacesService accepts as argument either a map or an node where to render the attributions for the results.
So you only have to use the node (a node being an html element) instead of the map.
Please note: hiding the attributions violates the places-policies(also hiding the map when used as argument, because the map will show the attributions)
This also may be interesting to you: Google places API does this violate the TOC?
Example: in a nutshell
If you're using jQuery:
var service = new google.maps.places.PlacesService($('#tag-id').get(0));
If plain Javascript:
var service = new google.maps.places.PlacesService(document.createElement('div'));
Then carry on as usual with the rest of the example code:
service.nearbySearch(request, callback);
Example: using details returned
Live demo of this example on jsFiddle.
Note: This example uses jQuery.
<ul class="reviews__content" id="reviews__content">
</ul>
<div id="service-helper"></div>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=GOOGLE_API_KEY_HERE&libraries=places&callback=getRelevantGoogleReviews">
</script>
<script type="text/javascript">
window.getRelevantGoogleReviews = function(){
var service = new google.maps.places.PlacesService($('#service-helper').get(0)); // note that it removes the content inside div with tag '#service-helper'
service.getDetails({
placeId: 'ChIJAwEf5VFQqEcRollj8j_kqnE' // get a placeId using https://developers.google.com/places/web-service/place-id
}, function(place, status) {
if (status === google.maps.places.PlacesServiceStatus.OK) {
var resultcontent = '';
for (i=0; i<place.reviews.length; ++i) {
//window.alert('Name:' + place.name + '. ID: ' + place.place_id + '. address: ' + place.formatted_address);
resultcontent += '<li class="reviews__item">'
resultcontent += '<div class="reviews__review-er">' + place.reviews[i].author_name + '</div>';
var reviewDate = new Date(place.reviews[i].time * 1000);
var reviewDateMM = reviewDate.getMonth() + 1;
var reviewDateFormatted = reviewDate.getDate() + '/' + reviewDateMM + '/' + reviewDate.getFullYear();
resultcontent += '<div class="reviews__review-date">' + reviewDateFormatted + '</div>';
resultcontent += '<div class="reviews__review-rating reviews__review-rating--' + place.reviews[i].rating +'"></div>';
if (!!place.reviews[i].text){
resultcontent += '<div class="reviews__review-comment">' + place.reviews[i].text + '</div>';
}
resultcontent += '</li>'
}
$('#reviews__content').append(resultcontent);
}
});
}
</script>
这篇关于谷歌地方图书馆没有地图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
