2014-02-26 2 views
6

Google지도가 페이지에로드되는 마지막 페이지인지 확인하고 페이지의 성능에 부정적인 영향을 미치지 않습니다.Defer 속성이 Google Maps API에서 작동하지 않습니까?

연기 속성이 후 ... 센서에있을 때 "= 거짓,지도가 표시되지 않습니다. 무엇 구글지도와 함께 연기 속성을 사용하는 가장 좋은 방법은? 것은이 경우에도 가능합니까?

<div id="map-canvas"></div> 
     <script src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false" defer></script> 
     <script defer> 
      function initialize() { 
       var mapOptions = { 
        center: new google.maps.LatLng(37.7599446, -122.4212681), 
        zoom: 12, 
        panControl: false, 
        disableDefaultUI: true, 
        scrollwheel: false, 
        mapTypeControl: false, 
        mapTypeControlOptions: { 
         style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR 
        }, 
        panControlOptions: { 
         position: google.maps.ControlPosition.LEFT_CENTER 
        }, 
        zoomControl: true, 
        zoomControlOptions: { 
         position: google.maps.ControlPosition.LEFT_CENTER 
        }, 
        mapTypeId: google.maps.MapTypeId.ROADMAP 
       }; 

       var map = new google.maps.Map(document.getElementById("map-canvas"), 
        mapOptions); 

       var marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(37.7599446, -122.4212681), 
        map: map, 
        title: '805 Valencia St. San Francisco, CA' 
       }); 
       var contentString = '<div id="map-content">' + 
        '<div id="siteNotice">' + 
        '</div>' + 
        '<h1 id="firstHeading" class="firstHeading">805 Valencia St.<br>San Francisco, CA</h1>' + 
        '<div id="bodyContent">' + 
        '' + 
        '<ul class="email-list"><li>[email protected]</li><li>[email protected]</li><li>[email protected]</li></ul>' + 
        '</div>' + 
        '</div>'; 

       var infowindow = new google.maps.InfoWindow({ 
        content: contentString, 
        maxWidth: 330 
       }); 

       google.maps.event.addListener(marker, 'click', function() { 
        infowindow.open(map, marker); 
       }); 

      } 

      google.maps.event.addDomListener(window, 'load', initialize); 
     </script> 

답변

10

당신은 API의 비동기 버전을 사용해야 연기 사용하는 경우 :

<script defer 
    src="http://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize"> 
</script> 

문제 :
0을 사용문서가 닫힐 때 - 내용이로드 될 때 스크립트가로드됩니다. 또한 외부에서 정의 된 스크립트는 인라인 defferred 스크립트 이후에 파싱됩니다.

이것은 당신의 이행과 관련된 두 가지 부작용이있다 : 그것은 한 후 사용하실 수 없습니다 document.write의 사용을 만들기 때문에

  1. 당신의 API의 동기 버전을 사용할 수 없습니다를

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

    ... 포인트 갔지에서 제공 : 문서는

  2. 호출이

    폐쇄되었습니다 Maps-API가 아직로드되지 않았으므로 google이 정의되지 않았으므로 initialize가 실행되지 않습니다.

관련 문제