1

我回来做更多关于我一直在研究的 Google 地图的工作。情况如下：

我有一张弗吉尼亚的地图。它里面会有标记，但我需要几个人添加/删除/编辑这些标记。因此，我在“我的地点”中创建了一个 Google 地图，并将生成的 KML 文件导入到我正在加载到 API 中的地图中。

我还试图通过在相邻州上绘制一个多边形并在其上添加一个不透明度为 75% 的白色图层来“白化”相邻州，以使弗吉尼亚州更加突出。

但是，我遇到了一个问题，如果来自 KML 图层的标记“重叠”到覆盖边界状态的多边形上，则不透明的多边形会覆盖图层并且标记变得不可点击。如果放大到足够大，可以单击标记，但我希望人们能够从原始缩放中单击标记。

我尝试先制作标记，然后添加 KML，然后先制作 KML，然后绘制多边形，但这似乎并不重要。我什至在这里尝试了解决方案的变体：在 google maps api v3 中完成多边形绘制时处理，我在其中放置触发器以在侦听器事件中添加 KML 层，但仍然没有骰子。

我在谷歌上的搜索也没有让我找到任何看起来有用的东西。我不知道这是否仍然是图层排序的问题，或者多边形是否以某种方式“覆盖”了 KML 图层，无论顺序如何，或者是否有某种方法可以明确告诉 KML 标记保持不变在多边形的顶部。

首先，这是我现在用来绘制图层的主要代码：

function initialize() {
  var mapOptions = {
    zoom: 7,
    center: new google.maps.LatLng(38, -79.5),
    disableDefaultUI: true,
    mapTypeId: google.maps.MapTypeId.TERRAIN
  }
  var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

  borderingStates(map);

  var participantsLayer = new google.maps.KmlLayer('https://maps.google.com/maps/ms?msa=0&msid=204048902337864904598.0004cc332e8034251c1db&ie=UTF8&ll=37.668046,-80.289717&spn=1.959603,5.642338&output=kml',{preserveViewport:true});

  google.maps.event.addListener(map,'idle', function() {
  participantsLayer.setMap(map);
 });

}

function loadScript() {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src = "https://maps.googleapis.com/maps/api/js?key=abc.def&sensor=false&callback=initialize";
  document.body.appendChild(script);
}

window.onload = loadScript;

接下来，这是我用来绘制多边形的代码示例。当我调用上面的 borderingStates 函数时会发生这种情况：

//Delaware
 DEpoints = [

new google.maps.LatLng(39.7188, -75.7919),
new google.maps.LatLng(39.5210, -75.7837),
...
new google.maps.LatLng(39.8296, -75.6477),
new google.maps.LatLng(39.7199, -75.7906)
];

  // Construct the polygon
  var Delaware = new google.maps.Polygon({
    paths: DEpoints,
    fillColor: invisColor,
    strokeOpacity: 0,
    fillOpacity: .75
  });

  Delaware.setMap(map);

然后我重复为每个状态绘制一个多边形 - 我认为有 6 或 7 个。

除了 Google Maps 固有地处理多边形和 KML 图层的方式之外，我不能说有什么特别的代码不会导致它工作。

4

2 回答 2

1

我建议您也使用 KmlLayer（或 FusionTablesLayer）制作多边形。您可以通过将图层添加到地图的顺序来控制图层的顺序（第一个在底部）。我相信原生 Google Maps API v3 多边形将始终出现在图层之上。您的另一个选择是使多边形“不可点击”（可点击：false）[不确定这是否可行]。

于 2012-10-24T18:35:23.323 回答
0

这是我的第一次提交，冒着被贴上牛仔标签的风险，这是我对这个问题的解决方案：

  1. 在第一次点击事件上删除多边形
  2. 设置计时器以恢复多边形（1 1/2 秒后）
  3. 在 1 1/2 秒的机会窗口期间捕获 KML 元素上的点击事件
google.maps.event.addListener(polygon, 'click', function () {
            polygon.setMap(null); // hide polygon for a 1 1/2 seconds           
            window.setTimeout(function () {
                polygon.setMap(map_canvas);
            }, 1500);
            // process polygon click now

        });

此方法确实意味着您将同时处理 Polygon 和 KML 元素单击事件，但在我们的示例中这很好。

于 2013-11-21T11:47:38.407 回答