9

Przeczytałem dokumenty i przykłady, ale wydaje mi się, że nie mogę rozwiązać błędu inicjalizacji ("Uncaught ReferenceError: google nie jest zdefiniowany" + Uncaught ReferenceError: homeLatLng nie jest zdefiniowany) podczas próby dołączenia pliku markerwithlabel.js i przypomina mi to "nie można załadować czegoś przed wykonaniem mapy".Google Maps API: markerwithlabel.js - Uncaught ReferenceError: google nie jest zdefiniowany

Co mogę zrobić?

Co próbowano:

<head> 
<script async defer src="https://maps.googleapis.com/maps/api/js?key=mykey&callback=initMap"></script> 
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js"></script> 
<script type="text/javascript"> 
    var map; 
    function initMap() { 

      map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 14, 
       center: {lat: 52.5200066, lng: 13.404954} 
      }); 

      var marker1 = new MarkerWithLabel({ 
        position: homeLatLng, 
        draggable: true, 
        raiseOnDrag: true, 
        map: map, 
        labelContent: "$425K", 
        labelAnchor: new google.maps.Point(22, 0), 
        labelClass: "labels", // the CSS class for the label 
        labelStyle: {opacity: 0.75} 
      }); 
    } 
</script> 

..

Odpowiedz

13

markerwithlabel.js wymaga już załadowane mapy-API.

Po załadowaniu map-API asynchronicznie (tak jak w swoim kodzie), nie ma gwarancji, że map-API zostanie załadowany po załadowaniu markerwithlabel.js.

rozwiązanie: załadować map-API synchronicznie

<script src="https://maps.googleapis.com/maps/api/js?v=3&key=mykey"></script> 
<script type="text/javascript" src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js"></script> 
<script type="text/javascript"> 
    var map; 
    function initMap() { 

      map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 14, 
       center: {lat: 52.5200066, lng: 13.404954} 
      }); 

      var marker1 = new MarkerWithLabel({ 
        position: homeLatLng, 
        draggable: true, 
        raiseOnDrag: true, 
        map: map, 
        labelContent: "$425K", 
        labelAnchor: new google.maps.Point(22, 0), 
        labelClass: "labels", // the CSS class for the label 
        labelStyle: {opacity: 0.75} 
      }); 
    } 
google.maps.event.addDomListener(window, 'load', initMap); 
</script> 
+0

To działa idealnie. (: Dziękuję za wyjaśnienie! – maxxyoo

+0

Wielkie dzięki. :-) Zmarnowałem godziny próbując to rozpracować. – user1355041

+0

"http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerwithlabel/src/markerwithlabel.js" nie istnieje. – Meysam

Powiązane problemy