0

我正在制作一个使用谷歌地图来帮助部署太阳能的网络应用程序。本质上，我正在全屏加载谷歌地图并使用以下代码覆盖 KML 图层：

window.solarLayer = new google.maps.KmlLayer({
url: 'somelink'
}); 
window.solarLayer.setMap(window.map);

这个应用程序的另一个特点是用户可以点击地图中的任何地方，并使用点击点的纬度和对数，它将太阳能数据返回给用户。

通过使用 click 事件处理程序，这一切都可以正常工作：

google.maps.event.addListener(map, 'click', function(event) {
    var latitude = event.latLng.lat();
    var longitude = event.latLng.lng();
    console.log( latitude + ', ' + longitude );
});

但是，具有 KML 图层的地图部分仅注册该图层的点击，而不会访问我创建的点击事件...

有谁知道如何禁用 KML 图层的点击事件？或者如何让我的事件侦听器取代 KML 层的事件侦听器？

我已经尝试通过在 KML 图层和地图上使用点击事件来获取经纬度，但这只会产生该图层所在位置的静态纬度经度，而不是用户实际点击的位置。

提前感谢您的帮助！

4

1 回答 1

5

将KmlLayer 的可点击选项设置为 false。

来自KmlLayerOptions 文档：

可点击| 类型：布尔值

如果为 true，则图层接收鼠标事件。默认值为真。

代码片段：

var map;

function initialize() {
  map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  window.solarLayer = new google.maps.KmlLayer({
    url: 'http://googlemaps.github.io/js-v2-samples/ggeoxml/cta.kml',
    clickable: false
  });
  window.solarLayer.setMap(window.map);


  google.maps.event.addListener(map, 'click', function(event) {
    var latitude = event.latLng.lat();
    var longitude = event.latLng.lng();
    document.getElementById('coords').innerHTML = event.latLng.toUrlValue(6);
    console.log(latitude + ', ' + longitude);
  });
}
google.maps.event.addDomListener(window, "load", initialize);
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="coords"></div>
<div id="map_canvas"></div>

于 2014-02-24T17:11:31.330 回答