我正在使用使用 Google map API 的 Polymer 创建自定义元素。我希望这个元素能够包含 Google map 的脚本标签。
这应该放在自定义元素中的什么地方?简单地将其放在页面顶部会引发跨域问题。
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
<link rel="import" href="../bower_components/polymer/polymer.html">
<polymer-element name="google-map" noscript>
<template>
<div id="stage"></div>
</template>
<script>
Polymer('google-map', {
ready: function() {
new google.maps.Map(this.$.stage, {
zoom: 15,
center: new google.maps.LatLng(0, 0),
mapTypeId: google.maps.MapTypeId.ROADMAP,
overviewMapControl: false,
panControl: false,
rotateControl: false,
scaleControl: false,
streetViewControl: false,
draggable: false,
maxZoom: 21
});
}
});
</script>
</polymer-element>
最佳答案
Fwiw,我相信规范中的当前分配是 <script src...>
进口将受到 CORS 限制。
您可以在此处查看我们如何在我们的 google-maps 元素中处理此问题:
https://github.com/Polymer/google-map/blob/master/google-map.html
关于将这种类型的加载机制本身概括为一个组件,已经有一些想法,但还没有人付诸实现。
关于javascript - 自定义元素中的脚本标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21740967/