catch되지 않은 형식 오류가 : 속성을 읽을 수 없습니다 정의되지 않은 Google지도의 '적용'

Question

내가지도에 마커를 만들기 위해 Google지도를 사용하고 내가 다음 코드를 사용하여 지오에 주소를 변환하려고

:

<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> 

때마다를 I 오류 메시지가 표시됩니다. 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>