получить широту и долготу из поисковой системы

-1

я знаю, что многие темы обсуждают это, но мой код все еще не работает. Я использую google places searchBox API.получить широту и долготу из поисковой системы

Мой код:

function initMap(){ 
      var map = new google.maps.Map(document.getElementById('peta'), { 
       center: {lat: -34.397, lng: 150.644}, 
       zoom: 16 
      }); 
      var infoWindow = new google.maps.InfoWindow({map: map}); 

      // Try HTML5 geolocation. 
      if (navigator.geolocation) { 
       navigator.geolocation.getCurrentPosition(function(position) { 
        var pos = { 
         lat: position.coords.latitude, 
         lng: position.coords.longitude 
        }; 

        infoWindow.setPosition(pos); 
        infoWindow.setContent('Your Location.'); 
        map.setCenter(pos); 
       }, function() { 
        handleLocationError(true, infoWindow, map.getCenter()); 
       }); 
      } else { 
       // Browser doesn't support Geolocation 
       handleLocationError(false, infoWindow, map.getCenter()); 
      } 

      var input = document.getElementById('alamat'); 
      var searchBox = new google.maps.places.SearchBox(input); 

      // Bias the SearchBox results towards current map's viewport. 
      map.addListener('bounds_changed', function() { 
       searchBox.setBounds(map.getBounds()); 
      }); 
      var markers = []; 
      // Listen for the event fired when the user selects a prediction and retrieve 
      // more details for that place. 
      searchBox.addListener('places_changed', function() { 
       var places = searchBox.getPlaces(); 

       if (places.length == 0) { 
        return; 
       } 

       // Clear out the old markers. 
       markers.forEach(function(marker) { 
        marker.setMap(null); 
       }); 
       markers = []; 

       // For each place, get the icon, name and location. 
       var bounds = new google.maps.LatLngBounds(); 
       places.forEach(function(place) { 
        var icon = { 
         url: place.icon, 
         size: new google.maps.Size(71, 71), 
         origin: new google.maps.Point(0, 0), 
         anchor: new google.maps.Point(17, 34), 
         scaledSize: new google.maps.Size(25, 25) 
        }; 

        // Create a marker for each place. 
        markers.push(new google.maps.Marker({ 
         map: map, 
         icon: icon, 
         title: place.name, 
         position: place.geometry.location 

        })); 

        if (place.geometry.viewport) { 
         // Only geocodes have viewport. 
         bounds.union(place.geometry.viewport); 
        } else { 
         bounds.extend(place.geometry.location); 
        } 
       }); 
       map.fitBounds(bounds); 
       document.getElementById('x').innerHTML(places.geometry.location.lat()); 
    }); 
}

ссылка Сценарий:

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

HTML:

<div id="peta" style="width:500px;height:380px;"></div> 
<input type="text" id="x" readonly="readonly" name="x">

я поставил document.getElementById на моем текстовом поле, но он все еще не показывает широту. Где я должен поставить этот код?
в другой теме:
var location= places.geometry.location;
var lat = location.lat();
, но это не работает тоже. Прошу прощения, если я повторю этот вопрос. Спасибо.

источник

2016-03-28 daniel

Я получаю javascript-ошибку с опубликованным кодом: 'Uncaught ReferenceError: map не определен'. Просьба представить [Минимальный, полный, проверенный и читаемый пример] (http://stackoverflow.com/help/mcve), который демонстрирует вашу проблему. И 'Uncaught TypeError: Невозможно прочитать значение свойства 'null' в этой строке' var input = document.getElementById ('alamat'); '(это не указано в HTML). – geocodezip

описание товара oke. прости. Я обновил описание. – daniel

Является ли ваш элемент #x текстовым полем ввода?

Если так попробовать:

document.getElementById('x').value = places.geometry.location.lat();

Это добавит широты до значения входного текстового поля.

Это то, чего вы пытаетесь достичь?

источник

2016-03-28 10:31:10 Adam

Да, это текстовое поле. но я уже пробовал это тоже. но это тоже не сработало. ха-ха. Я помещаю код в неправильное место? – daniel

Это не похоже. Вы хотите, чтобы он обновлялся, когда карта менялась, поэтому вам нужно, чтобы она находилась внутри слушателя. Что вы получите, если вы выполните console.log (places.geometry.location.lat()); '? Я предполагаю, что на самом деле это дано строковое значение? – Adam

Является ли #x текстовым полем или текстовой областью? – Adam

Я решил проблему.

как сказал @Dammeul, я разместить document.getElementById('x').value = place.geometry.location.lat();

внутри places.forEach(function (place)) Надеюсь, что это полезно.

источник

2016-03-28 11:15:34 daniel

получить широту и долготу из поисковой системы

ответ

Смежные вопросы