1

Está ocorrendo um erro no "google.maps.event.addDomListener(window, 'load', initialize);" e não consigo resolver :'(

function initialize() {
  var mapOptions = {
    center: {lat: -33.8688, lng: 151.2195},
    zoom: 13,
    scrollwheel: false
  };
  var map = new google.maps.Map(document.getElementById('map'),
    mapOptions);

  var input = /** @type {HTMLInputElement} */(
      document.getElementById('pac-input'));

  // Create the autocomplete helper, and associate it with
  // an HTML text input box.
  var autocomplete = new google.maps.places.Autocomplete(input);
  autocomplete.bindTo('bounds', map);

  map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);

  var infowindow = new google.maps.InfoWindow();
  var marker = new google.maps.Marker({
    map: map
  });
  google.maps.event.addListener(marker, 'click', function() {
    infowindow.open(map, marker);
  });

  // Get the full place details when the user selects a place from the
  // list of suggestions.
  google.maps.event.addListener(autocomplete, 'place_changed', function() {
    infowindow.close();
    var place = autocomplete.getPlace();
    if (!place.geometry) {
      return;
    }

    if (place.geometry.viewport) {
      map.fitBounds(place.geometry.viewport);
    } else {
      map.setCenter(place.geometry.location);
      map.setZoom(17);
    }

    // Set the position of the marker using the place ID and location.
    marker.setPlace(/** @type {!google.maps.Place} */ ({
      placeId: place.place_id,
      location: place.geometry.location
    }));
    marker.setVisible(true);

    infowindow.setContent('<div><strong>' + place.name + '</strong><br>' +
        'Place ID: ' + place.place_id + '<br>' +
        place.formatted_address + '</div>');
    infowindow.open(map, marker);
  });
}

// Run the initialize function when the window has finished loading.
google.maps.event.addDomListener(window, 'load', initialize);

2
  • Por favor, descreva melhor seu problema e qual o erro.
    – Phelipe
    Commented 13/01/2018 às 20:52
  • Uncaught ReferenceError: google is not defined Commented 13/01/2018 às 20:54

1 Resposta 1

0

Precisa carregar o plugin da API:

<script async defer
src="https://maps.googleapis.com/maps/api/js?key=CHAVE_DA_API">
</script>

Como você está iniciando o plugin via código em:

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

Então não deve especificar async defer na tag script (veja informações sobre async e defer nesta resposta), ficando somente:

<script src="https://maps.googleapis.com/maps/api/js?key=CHAVE_DA_API"></script>

Ou então você pode iniciar o plugin via callback na URL (aí sim é necessário o async e defer):

<script async defer
src="https://maps.googleapis.com/maps/api/js?key=CHAVE_DA_API&callback=initialize">
</script>

Então neste último caso, terá que apagar a linha google.maps.event.addDomListener(window, 'load', initialize); que tem o mesmo efeito do callback.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .