การสร้างองค์ประกอบโพลีเมอร์จาก Google Maps JavaScript API v3 หรือไม่ (ต้องการความช่วยเหลือ)

ดูเหมือนจะไม่สามารถโหลด Google Maps API ในหน้าหลักได้

หน้าเนื้อหา.html

<link rel="import" href="/th../components/polymer/polymer.html">
<link rel="import" href="/thgmaps-simplified.html" async>

<polymer-element name="page-content">

    <style>
        :host {
            height: 100%;
            width: 100%;
        }
        .page-content {
            width: 100%;
            height: 100%;
            background-color: black;
        }
    </style>
    <gmaps-simplified ></gmaps-simplified>
<script>
    Polymer({

    });
</script>

</polymer-element>
<page-content></page-content>

และ Google API ก็ใช้งานได้ด้วยตัวมันเอง

gmap-siimpled.html

<link rel="import" href="/th../components/polymer/polymer.html">

<polymer-element name="gmaps-simplified">
<template>

    <div id="mapCanvas" style="background-color:#73da9c;width: 100%;height: 100%"></div>

</template>
<script>
    Polymer('gmaps-simplified', {

        ready: function () {

            var stylers = [
                {
                    featureType: "water",
                    stylers: [
                        {
                            color: "#73da9c"
                }
]
}, {
                    featureType: "administrative",
                    stylers: [
                        {
                            visibility: "off"
                }
]
}, {
                    featureType: "landscape",
                    elementType: "labels",
                    stylers: [
                        {
                            color: "#808080"
                },
                        {
                            visibility: "off"
                }
]
}, {
                    featureType: "poi",
                    stylers: [
                        {
                            visibility: "off"
                }
]
}, {
                    featureType: "road",
                    stylers: [
                        {
                            visibility: "off"
                }
]
}, {
                    featureType: "transit",
                    stylers: [
                        {
                            visibility: "off"
                }
]
}, {
                    elementType: "labels",
                    stylers: [
                        {
                            visibility: "off"
                }
]
}, {
                    featureType: "landscape",
                    elementType: "geometry.stroke",
                    stylers: [
                        {
                            visibility: "off"
                }
]
}, {
                    featureType: "landscape",
                    elementType: "geometry",
                    stylers: [
                        {
                            color: "#cff2dd"
                }
]
}
];
            var minZoomLevel = 3;

            var map = new google.maps.Map(this.$.mapCanvas, {
                zoom: minZoomLevel,
                center: new google.maps.LatLng(35, 6.852363),
                disableDefaultUI: true,
                mapTypeControlOptions: {
                    mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'custommap']
                }
            });



            var styledMapOptions = {
                name: 'Nick Style'
            };

            var customStyledMap = new google.maps.StyledMapType(
                stylers, styledMapOptions);

            map.mapTypes.set('custommap', customStyledMap);
            map.setMapTypeId('custommap');

            // Limit the zoom level
            google.maps.event.addListener(map, 'zoom_changed', function () {
                if (map.getZoom() < minZoomLevel) map.setZoom(minZoomLevel);
            });
        }
    });
  </script>
 <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key={KEY}">
</script>
</polymer-element>
<gmaps-simplified></gmaps-simplified>

ฉันมี API เพื่อทำงานเป็นองค์ประกอบที่กำหนดเอง แต่เมื่อฉันเปิด page-content.html มันจะแสดงเฉพาะสีพื้นหลังของ gmaps-siimpled.html และคอนโซลก็แสดงข้อความแสดงข้อผิดพลาดต่อไปนี้:

ConsoleAgent: Failed to execute 'write' on 'Document': It isn't possible to      
write into a document from an asynchronously-loaded external script unless  
it is explicitly opened. (url: https://maps.googleapis.com/maps/api/js?
key={{KEY}}) in getScript:14

และ:

 ConsoleAgent: Uncaught TypeError: undefined is not a function (url: 
 http://127.0.0.1:56264/elements/gmaps-simplified.html) in Polymer.ready:29

มีตัวอย่างสำหรับ 'การโหลดแบบอะซิงโครนัส' บน หน้า api แต่ฉันไม่สามารถใช้งานกับโพลีเมอร์ได้ ..

มีใครมีความคิดเกี่ยวกับวิธีการบรรลุเป้าหมายนี้หรือไม่?

หรือการโหลดแบบอะซิงโครนัสไม่ใช่ปัญหาหลัก?

ความช่วยเหลือได้รับการชื่นชมอย่างมาก!