如何在将多个KML图层添加到地图时对其进行排序?

时间:2016-05-26 23:47:06

标签: javascript google-maps kml

我有两个KML图层在点击后加载到地图上:

model.layers[-1].get_output(train=False)

此代码可以工作并将两个图层加载到地图上,但我希望首先加载loadKmlLayer(src,map),但不是。奇怪的是,如果我刷新页面并再次尝试它!我无法弄清楚为什么以及如何在第一次使它加载到顶部。

srca层比src层大,所以我认为尺寸可能会影响它。任何帮助都会很好!

('LoadkmlLayer'和'LoadkmlLayera'是我代码中其他地方定义的函数。)

1 个答案:

答案 0 :(得分:1)

使用zIndex。 zIndex值最小的图层位于底部,最大值的图层位于顶部。

代码段



var name = "bcg";
var src = "https://github.com/YourCity/hello-world/blob/readme-edits/" + name + ".kmz?raw=true"
var srca = "https://www.dropbox.com/s/5g0tytd1ur7my67/v7.kmz?dl=1"


function initialize() {
  var mapCanvas = document.getElementById('map');
  var mapOptions = {
    center: new google.maps.LatLng(51.50275896, -0.11535645),
    zoom: 8,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(mapCanvas, mapOptions)

  loadKmlLayer(src, map, 1);
  loadKmlLayer(srca, map, 0);
}
google.maps.event.addDomListener(window, "load", initialize);

function loadKmlLayer(src, map, zIndex) {
  var ctaLayer = new google.maps.KmlLayer({
    url: src,
    zIndex: zIndex,
    map: map
  });
  google.maps.event.addListener(ctaLayer, 'status_changed', function() {
    document.getElementById('status').innerHTML += "src=" + src + " status=" + ctaLayer.getStatus() + "<br>";
  })
}
&#13;
html,
body,
#map {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
&#13;
<script src="https://maps.googleapis.com/maps/api/js"></script>
<button id="button2" onclick="myFunctiongr(); loadKmlLayer(); initialize()">Submit</button>
<div id="status"></div>
<div id="map"></div>
&#13;
&#13;
&#13;