【问题标题】:Disable click on polygon禁用单击多边形
【发布时间】:2013-01-10 07:20:19
【问题描述】:

我有以下代码使用 javascript v3 api 在谷歌地图上突出显示一个区域。

// Maps
$(document).ready(function(){
    if($(document).find("map_canvas"))
        Maps.init();
});
var Maps = {};
//The map to display
Maps.map;
//List of markers
Maps.markers = new Array();
Maps.markers.previous;
Maps.lines = new Array();
Maps.lines.toStart;
Maps.area;
//init the map
Maps.init = function() {
    var mapOptions = {
      center: new google.maps.LatLng(-39.483715,176.8942277),
      zoom: 15,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    Maps.map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

    google.maps.event.addListener(Maps.map, 'click', function(event){Maps.addMarker(event.latLng);});
}
//Add a marker to the maps
Maps.addMarker = function(latLng){
    var marker = new google.maps.Marker({
        position: latLng,
        map: Maps.map
    });
    Maps.markers.push(latLng);
    console.log(Maps.markers.length);
    if(Maps.markers.length > 1){
        Maps.drawLine([Maps.markers.previous, latLng]); 
    }
    Maps.markers.previous = latLng;
}

Maps.drawLine = function(path){
    var Line = new google.maps.Polyline({
        path: path,
        strokeColor: "#FF0000",
        strokeOpacity: 1.0,
        strokeWeight: 2
    });
    Line.setMap(Maps.map);
    if(Maps.markers.length > 2){
        if(Maps.lines.toStart != null)
            Maps.lines.toStart.setMap(null);
        Maps.lines.toStart = new google.maps.Polyline({
            path: [path[path.length - 1], Maps.markers[0]],
            strokeColor: "#0000FF",
            strokeOpacity: 1.0,
            strokeWeight: 2
        });
        Maps.lines.toStart.setMap(Maps.map);
        if(Maps.area != null)
            Maps.area.setMap(null);
        Maps.area = new google.maps.Polygon({
            paths: Maps.markers,
            strokeColor: "#000000",
            strokeOpacity: 0,
            strokeWeight: 0,
            fillColor: "#FF0000",
            fillOpacity: 0.35
        });
        Maps.area.setMap(Maps.map);
    }
}

它按预期完美运行,并产生这样的结果......

但问题是,出于显而易见的原因,我需要在多边形内添加标记。当我单击期望添加标记的多边形时,多边形似乎得到了点击而不是地图。有没有办法解决这个问题?或者让它只有地图接收点击?

【问题讨论】:

    标签: javascript google-maps google-maps-api-3 google-maps-markers


    【解决方案1】:

    多边形选项中有一个clickable 属性。将其设置为 false,多边形将忽略点击,事件将落入地图。

    Polygon Options

    【讨论】:

      猜你喜欢
      • 2017-06-18
      • 1970-01-01
      • 2013-12-01
      • 2016-09-23
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2018-09-01
      • 2012-08-02
      相关资源
      最近更新 更多