i have code, works fine, there 1 issue getting:
when search nearby places, appends new nearby search markers old markers, screenshots attached in these links.
here have searched nearby banks: http://prntscr.com/aouxra
it has shown, if search nearby place hotel, append markers banks markers has been searched previously, this:
i want show markers of autocompleted nearby search query only.
function getnearby(lat,lng,map){ var availabletags = [ "hotel", "bank", "atm", "school", ]; $( "#nearby" ).autocomplete({ source: availabletags, select: function (event, ui) { var request = null; request = { location: {lat:lat, lng:lng}, radius: 5500, types: [ui.item.value] }; var service = null; var infowindow = null; infowindow = new google.maps.infowindow(); service = new google.maps.places.placesservice(map); service.nearbysearch(request, callback); //var markers = []; var markers = []; var bounds = map.getbounds() function callback(results, status) { if (status == google.maps.places.placesservicestatus.ok) { (var = 0; < results.length; i++) { createmarker(results[i]); //alert(results) } } } function createmarker(place) { //markers.push(place); var marker = ''; var placeloc = ''; placeloc = place.geometry.location; marker = new google.maps.marker({ map: map, position: placeloc }); markers.push(marker); google.maps.event.addlistener(marker, 'click', function() { infowindow.setcontent(place.name); infowindow.open(map, this); }); } alert(markers.length); } }); } function getlocation() { $("#mynearby").css('display', 'block'); $("#directions").css('display', 'none'); $("#map").css('display', 'none'); $("#panel").css('display', 'none'); $("#load").css('display', 'none'); $("#googlemap").css('display', 'block'); if (navigator.geolocation) { navigator.geolocation.getcurrentposition(showposition); } else { alert("geolocation not supported browser."); } } function showposition(position) { setlocationvalue(position.coords.latitude,position.coords.longitude); //getcurrentlocationvalue(position.coords.latitude,position.coords.longitude); var mapprop = { center:new google.maps.latlng(position.coords.latitude,position.coords.longitude), zoom:10, maptypeid:google.maps.maptypeid.roadmap }; var map=new google.maps.map(document.getelementbyid("googlemap"),mapprop); var mymarker = new google.maps.marker({ position: {lat:position.coords.latitude, lng:position.coords.longitude}, animation:google.maps.animation.bounce }); mymarker.setmap(map); var infowindow = new google.maps.infowindow({ content:"you located in lat: "+position.coords.latitude+' lng: '+position.coords.longitude }); infowindow.open(map,mymarker); getnearby(position.coords.latitude,position.coords.longitude,map); <?php /*?>$("#mynearby a").click(function(){ //alert('working'); var request = { location: {lat:position.coords.latitude, lng:position.coords.longitude}, radius: 5500, types: [$("#location").val()] }; 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) { (var = 0; < 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 }); google.maps.event.addlistener(marker, 'click', function() { infowindow.setcontent(place.name); infowindow.open(map, this); }); } });<?php */?> } function setlocationvalue(lat,lng){ var latlng = new google.maps.latlng(lat, lng); var geocoder = new google.maps.geocoder(); geocoder.geocode({latlng: latlng}, function(results, status) { if (status == google.maps.geocoderstatus.ok) { if (results[1]) { var arraddress = results; //console.log(results); $.each(arraddress, function(i, address_component) { if (address_component.types[0] == "locality") { itemlocality = address_component.address_components[0].long_name; //console.log("city: " + address_component.address_components[0].long_name + itemlocality); $("#location").val(itemlocality); } }); } else{ alert("no results found"); } } else { alert("geocoder failed due to: " + status); } }); }
remove existing markers map before showing new ones. make markers
array global, @ beginning of getnearby
:
for (var i=0; i<markers.length; i++) { markers[i].setmap(null); } markers = [];
Comments
Post a Comment