從谷歌地圖的搜索框中獲取長時間空檔API

Question

如何獲得搜索用戶的長版信用卡？我已經設置了這個jsfiddle，除了第一次搜索，一切都正常，當人們搜索'紐約'時，他們會在地圖上得到一個標記，當他們拖動標記時，我得到長拖尾，但是，我怎麼能起初的搜索長拖鞋？

https://jsfiddle.net/x1a9z5t5/

function init() { 
    var map = new google.maps.Map(document.getElementById('map-canvas'), { 
    center: { 
     lat: 40.730610, 
     lng: -73.935242 
    }, 
    zoom: 12 
    }); 

    var searchBox = new google.maps.places.SearchBox(document.getElementById('adress-input')); 
    map.controls[google.maps.ControlPosition.TOP_CENTER].push(document.getElementById('adress-input')); 


    google.maps.event.addListener(searchBox, 'places_changed', function() { 
    searchBox.set('map', null); 


    var places = searchBox.getPlaces(); 

    var bounds = new google.maps.LatLngBounds(); 
    var i, place; 
    for (i = 0; place = places[i]; i++) { 
     (function(place) { 
     var marker = new google.maps.Marker({ 
      position: new google.maps.LatLng(40.730610, -73.935242), 
      draggable: true, 
      position: place.geometry.location 
     }); 
     marker.bindTo('map', searchBox, 'map'); 
     google.maps.event.addListener(marker, 'map_changed', function() { 
      if (!this.getMap()) { 
      this.unbindAll(); 
      } 
     }); 
     bounds.extend(place.geometry.location); 

     google.maps.event.addListener(marker, 'dragend', function(evt) { 
      document.getElementById('long-lat').innerHTML = evt.latLng.lat().toFixed(3) + " " + evt.latLng.lng().toFixed(3); 
     }); 

     }(place)); 

    } 
    map.fitBounds(bounds); 
    searchBox.set('map', map); 
    map.setZoom(Math.min(map.getZoom(), 12)); 

    }); 
} 


google.maps.event.addDomListener(window, 'load', init); 

Answer 1

工作嘗試創建例如map.addListener('bounds_changed')新的偵聽器，因爲google.maps.event.addListener(marker, 'dragend'標記之後會聽已被拖動。

我這個添加到你的jsfiddle：搜索後

map.addListener('bounds_changed', function(e) { 
      console.log(place.geometry.location.lat()) 

      document.getElementById('long-lat').innerHTML = place.geometry.location.lat().toFixed(3) + " " + place.geometry.location.lng().toFixed(3); 
     }); 

結果：阻力後

結果：

希望這有助於。

Answer 2

/您可以根據您的需要修改此代碼代碼 /其完美

var map; 
var marker; 


function initialize() { 

    var mapOptions = { 
     center: new google.maps.LatLng(31.7596130,74.9353020), 
     zoom: 11, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 

} 

google.maps.event.addDomListener(window, 'load', initialize); 


function searchAddress() { 

    var addressInput = document.getElementById('address-input').value; 

    var geocoder = new google.maps.Geocoder(); 

    geocoder.geocode({address: addressInput}, function(results, status) { 

     if (status == google.maps.GeocoderStatus.OK) { 
     console.log(google.maps); 
      var myResult=results[0].geometry.location; 
     var lat = results[0].geometry.location.lat() 
     var long = results[0].geometry.location.lng(); 
     var myResult1=results[0].formatted_address; 


     document.getElementById('geoaddress').setAttribute('value',myResult1); 
     document.getElementById('lat').setAttribute('value',lat); 
     document.getElementById('long').setAttribute('value',long); 


console.log(myResult); 
     createMarker(myResult); 

     map.setCenter(myResult); 

     map.setZoom(18); 
     } 
     else 
     { 
      alert("The Address entered by you doesnot exists"); 
      document.getElementById('geoaddress').setAttribute('value',"Invalid Address"); 
      document.getElementById('lat').setAttribute('value',"Invalid Address"); 
     document.getElementById('long').setAttribute('value',"Invalid Address"); 
     } 
    }); 

} 

function createMarker(latlng) { 

    if(marker != undefined && marker != ''){ 
    marker.setMap(null); 
    marker = ''; 
    } 


}