2012-04-18 3 views
0

Я новичок в API автозаполнения Google Адресов, а также в разработке в целом, но я надеюсь, что кто-то может помочь мне указать направление в правильном направлении. Я просмотрел документацию и пример Google Адресов. При попытке дублировать пример Google, чтобы получить лучшее понимание (http://code.google.com/apis/maps/documentation/javascript/examples/places-autocomplete.html), я получаю следующую ошибку при ее запуске :Ошибка при запуске API автозаполнения Google Адресов

«Сервер API Карт Google отклонил ваш запрос. Параметр« датчик », указанный в запросе, должен быть установлен как« true »или« false ».»

Что такое сумасшествие? У меня есть «датчик», установленный на «false»! Пожалуйста, см. Ниже полный код страницы. Любые советы будут очень признательны.

<html> 
    <head> 
    <title>Google Maps JavaScript API v3 Example: Places Autocomplete</title> 
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places" 
     type="text/javascript"></script> 

    <style type="text/css"> 
     body { 
     font-family: sans-serif; 
     font-size: 14px; 
     } 
     #map_canvas { 
     height: 400px; 
     width: 600px; 
     margin-top: 0.6em; 
     } 
    </style> 

    <script type="text/javascript"> 
     function initialize() { 
      var mapOptions = { 
       center: new google.maps.LatLng(-33.8688, 151.2195), 
       zoom: 13, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }; 
      var map = new google.maps.Map(document.getElementById('map_canvas'), 
      mapOptions); 

      var input = document.getElementById('searchTextField'); 
      var autocomplete = new google.maps.places.Autocomplete(input); 

      autocomplete.bindTo('bounds', map); 

      var infowindow = new google.maps.InfoWindow(); 
      var marker = new google.maps.Marker({ 
       map: map 
      }); 

      google.maps.event.addListener(autocomplete, 'place_changed', function() { 
       infowindow.close(); 
       var place = autocomplete.getPlace(); 
       if (place.geometry.viewport) { 
        map.fitBounds(place.geometry.viewport); 
       } else { 
        map.setCenter(place.geometry.location); 
        map.setZoom(17); // Why 17? Because it looks good. 
       } 

       var image = new google.maps.MarkerImage(
       place.icon, 
       new google.maps.Size(71, 71), 
       new google.maps.Point(0, 0), 
       new google.maps.Point(17, 34), 
       new google.maps.Size(35, 35)); 
       marker.setIcon(image); 
       marker.setPosition(place.geometry.location); 

       var address = ''; 
       if (place.address_components) { 
        address = [(place.address_components[0] && 
         place.address_components[0].short_name || ''), 
         (place.address_components[1] && 
         place.address_components[1].short_name || ''), 
         (place.address_components[2] && 
         place.address_components[2].short_name || '') 
         ].join(' '); 
       } 

       infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + address); 
       infowindow.open(map, marker); 
      }); 

      // Sets a listener on a radio button to change the filter type on Places 
      // Autocomplete. 
      function setupClickListener(id, types) { 
       var radioButton = document.getElementById(id); 
       google.maps.event.addDomListener(radioButton, 'click', function() { 
        autocomplete.setTypes(types); 
       }); 
      } 

      setupClickListener('changetype-all', []); 
      setupClickListener('changetype-establishment', ['establishment']); 
      setupClickListener('changetype-geocode', ['geocode']); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <div> 
     <input id="searchTextField" type="text" size="50"> 
     <input type="radio" name="type" id="changetype-all" checked="checked"> 
     <label for="changetype-all">All</label> 

     <input type="radio" name="type" id="changetype-establishment"> 
     <label for="changetype-establishment">Establishments</label> 

     <input type="radio" name="type" id="changetype-geocode"> 
     <label for="changetype-geocode">Geocodes</label> 
    </div> 
    <div id="map_canvas"></div> 
    </body> 
</html> 

ответ

3

Попробуйте этот сценарий

<script> 
    function initialize() { 
var mapOptions = { 
    center: new google.maps.LatLng(-33.8688, 151.2195), 
    zoom: 13, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}; 
var map = new google.maps.Map(document.getElementById('map_canvas'), 
    mapOptions); 

var input = document.getElementById('searchTextField'); 
var autocomplete = new google.maps.places.Autocomplete(input); 

autocomplete.bindTo('bounds', map); 

var infowindow = new google.maps.InfoWindow(); 
var marker = new google.maps.Marker({ 
    map: map 
}); 

google.maps.event.addListener(autocomplete, 'place_changed', function() { 
    infowindow.close(); 
    marker.setVisible(false); 
    input.className = ''; 
    var place = autocomplete.getPlace(); 
    if (!place.geometry) { 
    // Inform the user that the place was not found and return. 
    input.className = 'notfound'; 
    return; 
    } 

    // If the place has a geometry, then present it on a map. 
    if (place.geometry.viewport) { 
    map.fitBounds(place.geometry.viewport); 
    } else { 
    map.setCenter(place.geometry.location); 
    map.setZoom(17); // Why 17? Because it looks good. 
    } 
    var image = new google.maps.MarkerImage(
     place.icon, 
     new google.maps.Size(71, 71), 
     new google.maps.Point(0, 0), 
     new google.maps.Point(17, 34), 
     new google.maps.Size(35, 35)); 
    marker.setIcon(image); 
    marker.setPosition(place.geometry.location); 

    var address = ''; 
    if (place.address_components) { 
    address = [ 
     (place.address_components[0] && place.address_components[0].short_name || ''), 
     (place.address_components[1] && place.address_components[1].short_name || ''), 
     (place.address_components[2] && place.address_components[2].short_name || '') 
    ].join(' '); 
    } 

    infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + address); 
    infowindow.open(map, marker); 
}); 

// Sets a listener on a radio button to change the filter type on Places 
// Autocomplete. 
function setupClickListener(id, types) { 
    var radioButton = document.getElementById(id); 
    google.maps.event.addDomListener(radioButton, 'click', function() { 
    autocomplete.setTypes(types); 
    }); 
} 

setupClickListener('changetype-all', []); 
setupClickListener('changetype-establishment', ['establishment']); 
setupClickListener('changetype-geocode', ['geocode']); 
    } 

    google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
+0

+1 для google.maps.event.addListener (автозаполнение, 'place_changed', функция() –

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