Question

如何使用谷歌地图搜索框api从搜索到的位置获取经度和纬度。

我使用与google演示相同的代码 - https://developers.google.com/maps/documentation/javascript/examples/places-searchbox

Answer 1

function GetLatlong()
    {
        var geocoder = new google.maps.Geocoder();
        var address = document.getElementById('textboxid').value;

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

            if (status == google.maps.GeocoderStatus.OK) {
                var latitude = results[0].geometry.location.lat();
                var longitude = results[0].geometry.location.lng();

            }
        });

您可以使用上述功能，该功能将为您提供用户输入区域的纬度和经度。

Answer 2

您提供的链接上的代码显示了输入搜索时要执行的功能。首先，它创建一个空的标记数组（一旦执行搜索，您在地图上看到的引脚）。

因此，请检查以：

开头的功能

google.maps.event.addListener(searchBox, 'places_changed', function() {

稍后您会看到已创建标记（甚至还有评论）：

// Create a marker for each place.
var marker = new google.maps.Marker({
    map: map,
    icon: image,
    title: place.name,
    position: place.geometry.location
});

因此，在place.geometry.location上您有一个Google地图位置对象。您可以使用place.geometry.location.lat()和place.geometry.location.lng()。

点击此处：https://stackoverflow.com/a/15315483/1012139

Answer 3

来自docs：

                // Autocomplete Options
                var defaultBounds = new google.maps.LatLngBounds();
                var options = {
                types: ['(cities)'],
                bounds: defaultBounds
                };

                // get DOM's input element
                var input = document.getElementById('location_address');

                // Make Autocomplete instance
                var autocomplete = new google.maps.places.Autocomplete(input, options);

                // Listener for whenever input value changes            
                autocomplete.addListener('place_changed', function() {

                    // Get place info
                    var place = autocomplete.getPlace();

                    // Do whatever with the value!
                    console.log(place.geometry.location.lat());
                });

Answer 4

我想你可能想看看Google Maps geocoding service

Answer 5

HTML：

<input type="text" id="address" name="address" value=""> //Autocomplete input address

<input type="hidden" name="s_latitude" id="s_latitude" value="" /> //get latitude
<input type="hidden" name="s_longitude" id="s_longitude" value="" /> //get longitude

JavaScript：

<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY&libraries=places&callback=initMap"
async defer></script>

<script>
var input = document.getElementById('address');
var originLatitude = document.getElementById('s_latitude');
var originLongitude = document.getElementById('s_longitude');

var originAutocomplete = new google.maps.places.Autocomplete(input);

    
originAutocomplete.addListener('place_changed', function(event) {
    var place = originAutocomplete.getPlace();

    if (place.hasOwnProperty('place_id')) {
        if (!place.geometry) {
                // window.alert("Autocomplete's returned place contains no geometry");
                return;
        }
        originLatitude.value = place.geometry.location.lat();
        originLongitude.value = place.geometry.location.lng();
    } else {
        service.textSearch({
                query: place.name
        }, function(results, status) {
            if (status == google.maps.places.PlacesServiceStatus.OK) {
                originLatitude.value = results[0].geometry.location.lat();
                originLongitude.value = results[0].geometry.location.lng();
            }
        });
    }
});
</script>

Answer 6

navigator.geolocation.getCurrentPosition(success => {

  console.log(success) // `have the lat and long`

}, failure =>{

//`enter code here if failed`

});

使用Javascript从Google Places搜索api获取纬度和经度

6 个答案: