遺漏的類型錯誤：無法讀取屬性未定義的谷歌地圖「應用」

Question

我使用谷歌地圖，使地圖上的標記，我試圖將地址轉換使用下面的代碼地址解析：

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

<script type="text/javascript"> 
var map; 

function initialize() { 
    var chamberLocation = {lat: 43, lng: -82}; 
    var geocoder = new google.maps.Geocoder(); 
    map = new google.maps.Map(document.getElementById('map'), { 
    center: {lat: 42.9745, lng: -82.4066}, 
    zoom: 14, 
    styles: [{"featureType":"road","elementType":"geometry","stylers":[{"visibility":"simplified"}]},{"featureType":"road.arterial","stylers":[{"hue":149},{"saturation":-78},{"lightness":0}]},{"featureType":"road.highway","stylers":[{"hue":-31},{"saturation":-40},{"lightness":2.8}]},{"featureType":"poi","elementType":"label","stylers":[{"visibility":"off"}]},{"featureType":"landscape","stylers":[{"hue":163},{"saturation":-26},{"lightness":-1.1}]},{"featureType":"transit","stylers":[{"visibility":"off"}]},{"featureType":"water","stylers":[{"hue":3},{"saturation":-24.24},{"lightness":-38.57}]}], 
    zoomControl: false, 
    scaleControl: false, 
    mapTypeControl: false, 
    disableDefaultUI: false, 
    streetViewControl: false, 
    rotateControl: false, 
    scrollwheel: false, 
    draggable: false 
    }); 
    codeAddress(geocoder, map); 

    } 

    function codeAddress(geocoder, map) { 
     var address = 'place'; 
     geocoder.geocode({ 'address' : address }), function(results, status) { 
      if (status == google.maps.GeocoderStatus.OK) { 
       var marker = new google.maps.Marker({ 
        map: map, 
        position: results[0].geometry.location 
       }); 
      } else { 
       console.log('This didnt work' + status); 
      } 
     }; 
    } 


</script> 

每當我這樣做我得到一個錯誤說Uncaught TypeError: Cannot read property 'apply' of undefined

什麼是造成這個錯誤？我不確定如何解決這個問題。我必須導入另一個Google地圖API嗎？

Answer 1

錯誤是一個錯字。我在下面的代碼中輸入了代碼//change，並在輸入錯誤的地方發表了評論。 geocoder.geocode({}, callback)是一個函數，它接受一個對象和回調，但你必須geocoder.geocode({ 'address' : address })，錯字是)應該geocoder.geocode({ 'address' : address }, function(results, status) { ...

<div id="map" style="width: 320px; height: 480px;"></div> 

    <script type="text/javascript"> 
    var map; 

    function initialize() { 
     // your code 
     // etc ... 
     codeAddress(geocoder, map); 
    } 

    function codeAddress(geocoder, map) { 
     var address = 'place'; 
     geocoder.geocode({ 
      'address': address 
     }, // change 
     function(results, status) { 
      if (status == 'OK') { // change 

      var marker = new google.maps.Marker({ 
       map: map, 
       position: results[0].geometry.location 
      }); 

      // some debug output 
      console.log("status is: " + status) 
      console.log("results is: " + JSON.stringify(results[0].geometry.location)) 
      } else { 
      console.log('This didnt work' + status); 
      } 
     }); 
    }; 
    </script> 

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