تأجيل السمة لا يعمل مع خرائط جوجل أبي?

Question

أحاول التأكد من أن خريطة جوجل هي آخر شيء يتم تحميله على الصفحة ولا يؤثر سلبا على أداء الصفحة.

عندما يتم وضع السمة تأجيل بعد ...الاستشعار = خطأ" ، لا تظهر الخريطة.ما هي أفضل طريقة لاستخدام السمة تأجيل مع خرائط جوجل?هل هذا ممكن حتى?

 <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>info@yourbetty.com</li><li>support@yourbetty.com</li><li>press@yourbetty.com</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>

Answer 1

عند استخدام التأجيل ، يجب عليك استخدام الإصدار غير المتزامن من واجهة برمجة التطبيقات:

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

القضية:
عند استخدام defer سيتم تحميل البرنامج النصي عند إغلاق المستند-تم تحميل المحتوى.وعلاوة على ذلك سيتم تحليل البرامج النصية ديفيريد الخارجية بعد البرامج النصية ديفيريد مضمنة.

هذا له اثنين من الآثار الجانبية المتعلقة بالتنفيذ الخاص بك:

1. لا يمكنك استخدام الإصدار المتزامن من واجهة برمجة التطبيقات ، لأنه يستخدم document.write ، والتي لا يمكن استخدامها بعد إغلاق المستند

2. المكالمة :

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

   ...يأتي في نقطة لم يتم فيها تحميل واجهة برمجة تطبيقات الخرائط بعد, google غير معرف ، لن يتم تنفيذ التهيئة أبدا.