Question

如何获得用户搜索的长篇大论？我已经设置了这个jsfiddle，一切正常，除了第一次搜索，当人们搜索“纽约”他们会在地图上得到一个标记，当他们拖动标记我得到长的拉特，但是，我怎么能得到首先是搜索的长篇大论？

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 = '';
  }


}

从谷歌地图API中的搜索框中获取长时间的拉特

2 个答案: