将KML图层添加到Blogger页面中嵌入的Google地图

时间:2015-05-21 13:39:15

标签: google-maps-api-3 kml blogger

我有一个带有嵌入式Google地图的Blogger页面,效果很好。当我尝试使用Google的Javascript API在地图顶部添加KML图层时,除了导航控件之外,地图变得完全黑了。如果我将kml图层设置为null,则会再次显示基础地图。

我在本地环境中测试了完全相同的代码并且工作正常。所以问题在于将代码嵌入Blogger页面。

下面是我的html和js。有谁知道问题可能是什么?

请注意,我在下面使用的示例kml文件只是一个没有任何位置标记的骨架,但是我已经尝试过与其他kml一起使用并得到相同的结果。

<html>
<head>
    <style type="text/css">
        #map-canvas { 
            height: 480px; 
            width: 500px; 
            margin: 0px; 
            padding: 0px 
        } 
    </style>

    <script src="https://maps.googleapis.com/maps/api/js?v=3" type="text/javascript"/>

    <script type="text/javascript">

        function initializeMap() { 
            var centre = new google.maps.LatLng(35.5906421,37.6945915); 
            var mapOptions = { 
                zoom: 3, 
                center: centre, 
                mapTypeId: google.maps.MapTypeId.TERRAIN
            } 

            var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
            var layer = new google.maps.KmlLayer({ 
                url: 'http://trackmytour.com/Dpxc9.kml', 
                preserveViewport: true 
            }); 

            layer.setMap(map); 
        } 

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

    </script>
</head>

<body>
    <p>
        Here is where I'll be tracking my progress.<br>
        <br>
        <br>
    </p>
    <div id="map-canvas"/>
</body>

</html>

0 个答案:

没有答案