Erratische Ergebnisse mit modifiziertem Beispiel

-1

Ich verwende eine sehr leicht modifizierte Version eines API-Beispiels, ich habe eine Funktion namens vacationset(), die ich anrufe, um die Eingaben für mein Formular zu erstellen, das Problem ist die API nicht. t scheinen immer zu laden. Manchmal funktioniert die Autocomplete-Funktion und das Autocomplete-Feld funktioniert so, wie es soll und manchmal ist das Autocomplete-Feld nur ein normales Textfeld ohne offensichtliche API-Funktionalität. Wenn jemand mir ein wenig Richtung geben könnte, warum es manchmal funktioniert und zu anderen Zeiten, wäre ich nicht sehr dankbar. Vielen Dank.Erratische Ergebnisse mit modifiziertem Beispiel

<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/28/1/intl/en_gb/common.js"></script> 
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/28/1/intl/en_gb/util.js"></script> 
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/28/1/intl/en_gb/controls.js"></script> 
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/28/1/intl/en_gb/places_impl.js"></script> 
<script type="text/javascript" charset="UTF-8" src="https://maps.googleapis.com/maps-api-v3/api/js/28/1/intl/en_gb/stats.js"></script> 
</head> 
    <body> 

    <?php 

     function venueset() 
     { 
      echo ' 
     <div id="locationField"> 
     <input id="autocomplete" placeholder="Enter venue" onfocus="geolocate()" type="text" name="venue" autocomplete="off"> 
    </div> 

    <div id="address"> 
      <input type="hidden" class="field" name="name" id="business" disabled="true"> 
      <input type="hidden" class="field" name="number" id="street_number" disabled="true"> 
      <input type="hidden" class="field" name="street" id="route" disabled="true"> 
      <input type="hidden" class="field" name="city" id="locality" disabled="true"> 
      <input type="hidden" class="field" id="administrative_area_level_1" disabled="true"> 
      <input type="hidden" class="field" name="postcode" id="postal_code" disabled="true"> 
      <input type="hidden" class="field" name="country" id="country" disabled="true"> 
    </div> 
    '; 
    } 

    ?> 
    <!-- Replace the value of the key parameter with your own API key. --> 
    <script> 
     function initAutocomplete() { 
     var input = document.getElementById('autocomplete'); 
     var options = { 
      types: ['geocode', 'establishment'] 
     }; 
     autocomplete = new google.maps.places.Autocomplete(input, options); 

     autocomplete.addListener('place_changed', fillInAddress); 

     }; 

     function fillInAddress() { 
     // Get the place details from the autocomplete object. 
     var place = autocomplete.getPlace(); 

     for (var component in componentForm) { 
      document.getElementById(component).value = ''; 
      document.getElementById(component).disabled = false; 
     } 
     document.getElementById("business").value = place.name; 
     document.getElementById("business").disabled = false; 
     // Get each component of the address from the place details 
     // and fill the corresponding field on the form. 
     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; 
      } 
     } 
     } 
    </script> 
    <script src="https://maps.googleapis.com/maps/api/js?libraries=places&amp;callback=initAutocomplete" async="" defer=""></script> 
     <script type="text/javascript"> 
      // This example displays an address form, using the autocomplete feature 
    // of the Google Places API to help users fill in the information. 

    // This example requires the Places library. Include the libraries=places 
    // parameter when you first load the API. For example: 
    // <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=places"> 

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



    // Bias the autocomplete object to the user's geographical location, 
    // as supplied by the browser's 'navigator.geolocation' object. 
    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> 
    </body></html> 
     </script> 
     <script src="https://maps.googleapis.com/maps/api/js?key=api_key_removed&libraries=places&callback=initAutocomplete" 
      async defer></script> 
     </body> 
    </html>

Quelle

2017-02-15 Andrew

Sie laden die API nicht korrekt. Sie sollten es laden, wie in the documentation

aus dieser Dokumentation beschrieben:

Die folgende Bootstrap-Anfrage zeigt, wie die google.maps.geometry Bibliothek der Maps JavaScript API anfordern:
<script type="text/javascript" 
    src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=geometry"> 

Sie laden sich gerade die s Teile der API separat (z. https://maps.googleapis.com/maps-api-v3/api/js/28/1/intl/en_gb/common.js), das wird nicht zuverlässig sein.

Quelle

2017-02-15 15:40:05 geocodezip

Vielen Dank! Scheint, den Trick getan zu haben. – Andrew

Erratische Ergebnisse mit modifiziertem Beispiel

Antwort

Verwandte Themen