2016-11-27 2 views
0

Google Maps API 오류 : initMap is not a function이 표시됩니다. 기이 한 일은 내지도가 내 로컬 테스트에서 잘 작동한다는 것입니다. 그런 다음 내 사이트에 업로드하여 오류가 발생했습니다. 이제 내 로컬 컴퓨터에서 작동하지 않습니다. 무슨 일 이니?Google지도 API 오류 : "initMap은 함수가 아닙니다."

HTML

<div class="row"> 
    <div class="container-fluid"> 
     <div id="map" 
      class="hidden-xs hidden-sm" 
      style="width:101%;height:400px;background:yellow"> 
     </div> 
    </div>  
</div> 

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) --> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 

<!-- Include all compiled plugins (below), or include individual files as needed --> 
<script src="js/bootstrap.min.js"></script> 
<script> 
    function myMap() { 
     var myCenter = new google.maps.LatLng(40.488158, -85.615340); 
     var mapCanvas = document.getElementById("map"); 
     var mapOptions = { 
      center: myCenter, 
      zoom: 18 
     }; 
     var map = new google.maps.Map(mapCanvas, mapOptions); 
     var marker = new google.maps.Marker({ 
      position: myCenter, 
      icon: 'img/smally.png', 
      animation: google.maps.Animation.BOUNCE 
     }); 

     marker.setMap(map); 
    } 
</script> 
<script src="https://maps.googleapis.com/maps/api/js?callback=myMap"></script> 
+0

이 어디 당신'<스크립트 SRC = "https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=myMap" 비동기 연기>'API 키? – RizkiDPrast

+0

w3 학교는 과도한 교통량을 계획하는 경우에만 필요하다고 말했다. 그게 문제 야? @rizkidprast –

+0

이 항목을 확인해보십시오. [https://developers.google.com/maps/documentation/javascript/get-api-key](https://developers.google.com/maps/documentation/javascript/get- api-key) – RizkiDPrast

답변

1

봅니다 async=""이 같은뿐만 아니라 속성을 제공합니다. 작동 :

function myMap() { 
 
    var myCenter = new google.maps.LatLng(40.488158, -85.615340); 
 
    var mapCanvas = document.getElementById("map"); 
 
    var mapOptions = { 
 
    center: myCenter, 
 
    zoom: 18 
 
    }; 
 
    var map = new google.maps.Map(mapCanvas, mapOptions); 
 
    var marker = new google.maps.Marker({ 
 
    position: myCenter, 
 
    icon: 'img/smally.png', 
 
    animation: google.maps.Animation.BOUNCE 
 
    }); 
 

 
    marker.setMap(map); 
 
}
<script src="https://maps.googleapis.com/maps/api/js?callback=myMap" async="" defer=""></script> 
 

 
<div class="row"> 
 
    <div class="container-fluid"> 
 
    <div id="map" class="hidden-xs hidden-sm" style="width:101%;height:400px;background:yellow"> 
 
    </div> 
 
    </div> 
 
</div>

관련 문제