InvalidValueError: initAutocomplete bir işlev değildir Google Rehber ve Otomatik Tamamlama API'si

Question

Bir duvara çarptığımda yardımcı olabileceğinizi umarız, ayrıca Google'ın Rehber API'lerini kullanmakta oldukça yeniyim.

Sadece kod çalıştırdığımda, kod çalıştırdığımda, çalıştırılmakta olan 2 parçayı ayırmak için kullanıyorum.

Google tarafından sağlanan Javascript örneklerinden çalışan Otomatik Tamamlama API'sine ek olarak Google'ın Rehber'i kullanıyorum. "Sen dahil ettik Bu bana verdi

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script> 

:

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

ve benim belgenin üstündeki bu senaryo:

Başlangıçta benim dokümanın altına aşağıdaki komut dosyasını vardı Bu sayfada birçok kez Google Haritalar API'sı. Bu, beklenmedik hatalara neden olabilir. " bu nedenle bu içine baktıktan sonra böyle birlikte hem birleşti:

Ancak

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places&callback=initAutocomplete&sensor=false"></script> 

, şimdi bu yapmış olduğu, ben aşağıdaki hataları alırsınız:

InvalidValueError: initAutocomplete is not a function 
TypeError: searchBox is undefined 

Ben tezler Bu hataları almazsınız Komut dosyaları birleştirilmez, ancak daha sonra fark ettim ki, Yerler API'sini gerektiren işlevler çalışmayı durdurdu. Otomatik Tamamlama API başvurusunu kaldırırsam, Yerler işlevi çalışır.

Bunların her ikisini birlikte nasıl oluşturabileceğimi, bunları bir işlev değil 'sorununun gösterildiği gibi çözerek nasıl birleştirebileceğine dair herhangi bir fikir var mı?

Herhangi bir öneri çok minnettar olacaktır, gerçekten kodu görmeniz gerekiyorsa lütfen bana bildirin. Senaryoyu dahil ederken 'geri' param ihmal

//maps.googleapis.com/maps/api/js?key=__API-KEY__&libraries=places 

Not: Sen kullanmalıdır önceden

sayesinde Steph

Answer 1

gibi sadece bir kez senaryoyu sayılabilir. Belki kafasında gmaps senaryoyu dahil etmek gerekir

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

ya da js satır içi yerleştirilir eğer, 'google tanımlı değil' hatası alacağı: Sonra gibi pencere yüklendiğinde initAutocomplete yükleyin.

Answer 2

Google Maps Autocompletion API: Yakalanmayan InvalidValueError: initAutocomplete olmayan bir fonksiyon Aşağıda

benim kod:

<div id="locationField"> 
     <input id="autocomplete" placeholder="Enter your address" type="text"></input> 
    </div>--This is the input field 
    <script>-- This is Javascript 

     var placeSearch, autocomplete; 
     var componentForm = { 
     street_number: 'short_name', 
     route: 'long_name', 
     locality: 'long_name', 
     administrative_area_level_1: 'short_name', 
     country: 'long_name', 
     postal_code: 'short_name' 
     }; 

     function initAutocomplete() { 
      autocomplete = new google.maps.places.Autocomplete(
      /** @type {!HTMLInputElement} */(document.getElementById('autocomplete')), 
      {types: ['geocode']}); 
      autocomplete.addListener('place_changed', fillInAddress); 
     } 

     function fillInAddress() { 

     var place = autocomplete.getPlace(); 

     for (var component in componentForm) { 
      document.getElementById(component).value = ''; 
      document.getElementById(component).disabled = false; 
     } 


     for (var i = 0; i < place.address_components.length; i++) { 
      var addressType = place.address_components[i].types[0]; 
      if (componentForm[addressType]) { 
      var val = place.address_components[i][componentForm[addressType]]; 
      document.getElementById(addressType).value = val; 
      } 
     } 
     } 


     function geolocate() { 
     if (navigator.geolocation) { 
      navigator.geolocation.getCurrentPosition(function(position) { 
      var geolocation = { 
       lat: position.coords.latitude, 
       lng: position.coords.longitude 
      }; 
      var circle = new google.maps.Circle({ 
       center: geolocation, 
       radius: position.coords.accuracy 
      }); 
      autocomplete.setBounds(circle.getBounds()); 
      }); 
     } 
     } 
    </script> 

<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAQQUPe-GBmzqn0f8sb_8xZNcseul1N0yU&libraries=places&callback=initAutocomplete" async defer></script>