Question

我不是一个程序员，但我学得很快。对不起，如果我的代码不够漂亮。

我正在使用以下代码使用google maps API将.KML拉到样式化地图。我已经很好地解决了这个问题并且已经找到了各种解决方案，但是我很难同时将多个.KML图层调用到地图上。

我在下面使用的代码已从多个来源中提取，包括堆栈中的其他帖子（我在发布之前进行了搜索）但是它不是很有效，所以我一定错过了引用layers变量的方式。为什么我的.KML图层不显示？

<script type="text/javascript">
    <style>
      #map {
        width: 100%;
        height: 400px;
      }
</style>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script>
 /**
 * @fileoverview Sample showing capturing a KML file click
 *   and displaying the contents in a side panel instead of
 *   an InfoWindow
 */
var map;
var layers = [];
      layers [0] = new google.maps.KmlLayer("http://www.pipeleaks.org/map_files/Line9AB.kml",{
        preserveViewport: false
      });

      layers [1] = new google.maps.KmlLayer("http://www.pipeleaks.org/map_files/Line9FirstNations1.kml",{
        preserveViewport: false
      });

      layers [2] = new google.maps.KmlLayer("http://www.pipeleaks.org/map_files/Line9FirstNations2.kml",{
        preserveViewport: false
      });

/**
 * Initializes the map and calls the function that creates polylines.
 */
function initialize() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: new google.maps.LatLng(43.6424359, -79.37448849999998),
    zoom: 2,
    disableDefaultUI: true,
    mapTypeId: google.maps.MapTypeId.ROAD

  });
   loadKmlLayer(layers, map);
}

 map.set('styles', [
  {
   featureType: 'all', 
   elementType: 'geometry.fill', 
   stylers: [ 
     { visibility: 'off' }, 
     { color: '#000000' }
     ]
     },
  { 
   featureType: 'landscape.natural.terrain', 
   elementType: 'geometry.stroke', 
   stylers: [ 
     { visibility: 'on' }, 
     { color: '#FFFFFF' }, 
     { weight: 1 } 
   ] 
  },
  {
   featureType: 'landscape.natural.terrain', 
   elementType: 'geometry.fill', 
   stylers: [ 
     { visibility: 'on' }, 
     { color: '#FFFFFF' }
     ]
     },
  {
    featureType: 'landscape.natural.terrain', 
    stylers: [ 
      { visibility: 'on' },
      ]
      },
{
   featureType: 'water', 
   elementType: 'geometry.fill', 
   stylers: [ 
     { visibility: 'on' }, 
     { color: '#365F91' }
     ]
     },
  {
    featureType: 'road',
    elementType: 'geometry',
    stylers: [
      { visibility: 'on' }
    ]
  }, {
    featureType: 'road',
    elementType: 'labels',
    stylers: [
      { visibility: 'on' }
    ]
  }, {
  featureType: 'poi',
  elementType: 'geometry',
  stylers: [
    { visibility: 'off' }
  ]
}, { 
  elementType: 'labels.icon', 
  stylers: [ 
    { visibility: 'on' } 
  ] },
  { 
  elementType: 'labels.text.stroke', 
  stylers: [ 
    { visibility: 'on' } 
  ] },
  { 
  elementType: 'labels.text.fill', 
  stylers: [ 
    { visibility: 'on' } 
  ] }

]);
}


/**
 * Adds a KMLLayer based on the URL passed. 
 */
function loadKmlLayer(layers, map) {
  var kmlLayer = new google.maps.KmlLayer(layers, {

    preserveViewport: false,
    map: map});

}


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

Answer 1

我玩了一些代码

这项工作..

{{1}}

Google Maps API多个KML图层

1 个答案: