i display map limits nearby results category designate. have code allows user complete own search, modify search disabled , category predefined. source: http://www.gurchet-rai.net/apps/places/
$(document).ready(function(){ var loc; var map; var service; var infowindow; var overlays = []; var resultlist = []; var ismobile = $(window).width < 767; try { if (typeof navigator.geolocation !== 'undefined') { navigator.geolocation.getcurrentposition ( function(position) { var coords = position.coords; loc = new google.maps.latlng(coords.latitude, coords.longitude); map = new google.maps.map(document.getelementbyid("map_canvas"), { maptypeid: google.maps.maptypeid.roadmap, maptypecontrol: false, center: loc, zoom: 13 }); service = new google.maps.places.placesservice(map); infowindow = new google.maps.infowindow(); }, function(error) { if (error.code == 1) { $('#location-details').append('please enable location tracking in web browser'); } else if (error.code == 2) { $('#location-details').append('unable determine location - please ensure location tracking enabled in browser'); } else { $('#location-details').append('unable determine location'); } }, {enablehighaccuracy: true} ); } else { $('#location-details').append('your browser not support location tracking'); } } catch (e) { alert('an error has occured'); } function plotresultlist(){ var iterator = 0; for(var = 0; < resultlist.length; i++){ settimeout(function(){ var lat = resultlist[iterator].geometry.location.za; var lng = resultlist[iterator].geometry.location.ya; var name = resultlist[iterator].name; var addr = resultlist[iterator].formatted_address; var reference = resultlist[iterator].reference; var marker = new google.maps.marker({ position: resultlist[iterator].geometry.location, map: map, title: name, animation: ismobile? 'undefined' : google.maps.animation.drop }); overlays.push(marker); google.maps.event.addlistener(marker, 'click', function() { infowindow.close(); var request = { reference: reference }; service.getdetails(request, function(place, status){ var content = "<h6>" + name + "</h6>"; if(status == google.maps.places.placesservicestatus.ok){ if(typeof place.rating !== 'undefined'){ var badgetype = ''; if (place.rating < 2){ badgetype = 'badge-important'; } else if (place.rating >= 2 && place.rating <= 3){ badgetype = 'badge-warning'; } else { badgetype = 'badge-success'; } content += "<p><small>rating: <span class='badge " + badgetype + "'>" + place.rating + "</span></small></p>"; } if(typeof place.formatted_address !== 'undefined'){ content += "<br><small>" + place.formatted_address + "</small>"; } if(typeof place.formatted_phone_number !== 'undefined'){ content += "<br><small><a href='tel:" + place.formatted_phone_number + "'>" + place.formatted_phone_number + "</a></small>"; } if(typeof place.website !== 'undefined'){ content += "<br><small><a href='" + place.website + "'>website</a></small>"; } } infowindow.setcontent(content); infowindow.open(map, marker); }); }); iterator++; }, ismobile? 0: (i * 75)); } } $('#search').submit(function(e){ e.preventdefault(); var query = $('#query').val(); var request = { location: map.getcenter(), radius: '5000', query: query }; service.textsearch(request, function(results, status, pagination){ for(var = 0; < overlays.length; i++){ overlays[i].setmap(null); } resultlist.length = 0; overlays.length = 0; if (status == google.maps.places.placesservicestatus.ok) { resultlist = resultlist.concat(results); plotresultlist(); } }); }); });
take on maps javascript api, in types parameter. here described allowed types.
let's want show airports based on user's search, request be:
var request = { location: map.getcenter(), radius: '5000', query: query, types: ['airport'] }; 
Comments
Post a Comment