Google Maps automatische Vervollständigung Provinz

Ich bin mit Google Maps APIs Leitfaden für die automatische Vervollständigung:Google Maps automatische Vervollständigung Provinz

https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform

aber es scheint, ist es nicht möglich Italien Provinzen zu erkennen.

Zum Beispiel: Eingabe einer italienischen Adresse "Caronno Pertusella, VA, Italia", ich kann "VA" nicht erkennen.

Ich habe versucht, Hinzufügen und Ändern von Parametern: https://developers.google.com/maps/documentation/javascript/geocoding

aber ich kann nicht Provinz Parameter finden.

Quelle

2017-11-15 Eleonora Spinelli

Wenn Sie suchen nach: "Caronno Pertusella VA, Italia" = ohne Komma vor VA, werden Sie es bekommen. Auch "Caronno Pertusella VA, It" wird funktionieren. Nach dem Stadtkomma, Autocomplete warten die Länder- oder Landesvorwahl.

Übrigens, warum wählen Sie nicht einfach einen der Vorschläge zur automatischen Vervollständigung? Wenn Sie "Caronno" eingeben, erhalten Sie als Vorschlag: "Caronno Pertusella Varese, Italia"

Quelle

2017-11-15 17:22:54 ReFran

Ich denke, meine Frage ein wenig mit dem, Reinhard spielen es nicht klar ist, ich weiß nicht, was das Feld, das Provinz zurückzukehren. Inside "componentForm" Variable: 'var componentForm = { street_number: 'short_name', Route: 'short_name', Lokalität: 'long_name', administrative_area_level_1: 'short_name', Land: 'long_name', postal_code: ' short_name ', sublocality:' long_name ', Schnittpunkt:' long_name ' }; ' –

Das hätte einfacher sein können. Ich denke, Sie suchen nach administrative_area_level_2. Da dieses Niveau von Land zu Land unterschiedlich ist, müssen Sie testen, welches Niveau zu Ihrem Bedarf passt. Anbei ein Beispiel mit administrative_area_level_2 ('short_name'). Sie können

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    <title>Place Autocomplete Address Form</title> 
 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
 
    <meta charset="utf-8"> 
 
    <style> 
 
     /* Always set the map height explicitly to define the size of the div 
 
     * element that contains the map. */ 
 
     #map { 
 
     height: 100%; 
 
     } 
 
     /* Optional: Makes the sample page fill the window. */ 
 
     html, body { 
 
     height: 100%; 
 
     margin: 0; 
 
     padding: 0; 
 
     } 
 
    </style> 
 
    <link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"> 
 
    <style> 
 
     #locationField, #controls { 
 
     position: relative; 
 
     width: 480px; 
 
     } 
 
     #autocomplete { 
 
     position: absolute; 
 
     top: 0px; 
 
     left: 0px; 
 
     width: 99%; 
 
     } 
 
     .label { 
 
     text-align: right; 
 
     font-weight: bold; 
 
     width: 100px; 
 
     color: #303030; 
 
     } 
 
     #address { 
 
     border: 1px solid #000090; 
 
     background-color: #f0f0ff; 
 
     width: 480px; 
 
     padding-right: 2px; 
 
     } 
 
     #address td { 
 
     font-size: 10pt; 
 
     } 
 
     .field { 
 
     width: 99%; 
 
     } 
 
     .slimField { 
 
     width: 80px; 
 
     } 
 
     .wideField { 
 
     width: 200px; 
 
     } 
 
     #locationField { 
 
     height: 20px; 
 
     margin-bottom: 2px; 
 
     } 
 
    </style> 
 
    </head> 
 

 
    <body> 
 
    <div id="locationField"> 
 
     <input id="autocomplete" placeholder="Enter your address" 
 
      onFocus="geolocate()" type="text"></input> 
 
    </div> 
 

 
    <table id="address"> 
 
     <tr> 
 
     <td class="label">Street address</td> 
 
     <td class="slimField"><input class="field" id="street_number" 
 
       disabled="true"></input></td> 
 
     <td class="wideField" colspan="2"><input class="field" id="route" 
 
       disabled="true"></input></td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">City</td> 
 
     <!-- Note: Selection of address components in this example is typical. 
 
      You may need to adjust it for the locations relevant to your app. See 
 
      https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform 
 
     --> 
 
     <td class="wideField" colspan="3"><input class="field" id="locality" 
 
       disabled="true"></input></td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">Region</td> 
 
     <td class="slimField"><input class="field" 
 
       id="administrative_area_level_2" disabled="true"></input></td> 
 
     <td class="label">Zip code</td> 
 
     <td class="wideField"><input class="field" id="postal_code" 
 
       disabled="true"></input></td> 
 
     </tr> 
 
     <tr> 
 
     <td class="label">State</td> 
 
     <td class="wideField" colspan="3"><input class="field" 
 
       id="administrative_area_level_1" disabled="true"></input></td> 
 
\t </tr> 
 
     <tr> 
 
\t \t <td class="label">Country</td> 
 
     <td class="wideField" colspan="3"><input class="field" 
 
       id="country" disabled="true"></input></td> 
 
     </tr> 
 
    </table> 
 

 
    <script> 
 
     // 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', 
 
     administrative_area_level_2: 'short_name', 
 
\t \t country: 'long_name', 
 
     postal_code: 'short_name' 
 
     }; 
 

 
     function initAutocomplete() { 
 
     // Create the autocomplete object, restricting the search to geographical 
 
     // location types. 
 
     autocomplete = new google.maps.places.Autocomplete(
 
      /** @type {!HTMLInputElement} */(document.getElementById('autocomplete')), 
 
      {types: ['geocode']}); 
 

 
     // When the user selects an address from the dropdown, populate the address 
 
     // fields in the form. 
 
     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; 
 
     } 
 

 
     // 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&callback=initAutocomplete" 
 
     async defer></script> 
 
    </body> 
 
</html>

Quelle

2017-11-16 17:30:28 ReFran

Google Maps automatische Vervollständigung Provinz

Antwort

Verwandte Themen