谷歌地图api v3 - 如何限制多边形线的数量和强制关闭在5点击？

问题描述

我有这段代码

i have this code

<script>
    function initialize() {
        var mapOptions = {
            center: new google.maps.LatLng(-34.397, 150.644),
            zoom: 8
        };

        var map = new google.maps.Map(document.getElementById('map-canvas'),
            mapOptions);

        var drawingManager = new google.maps.drawing.DrawingManager({
            drawingMode: google.maps.drawing.OverlayType.MARKER,
            drawingControl: true,
            drawingControlOptions: {
                position: google.maps.ControlPosition.TOP_CENTER,
                drawingModes: [
                    google.maps.drawing.OverlayType.POLYGON
                ]
            },
            polygonOptions: {
                draggable: true,
                editable: true,
                strokeColor: "#000",
                strokeWeight: "2"
            }
        });
        drawingManager.setMap(map);

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

我试图将多边形的行数限制为5，并通过5次点击强制关闭多边形的形状。

And i am trying to limit the number of polygon lines to 5 and by the 5 click to force closure of the polygon shape.

我无法找到解决此问题的任何方向。如果您有任何关于良好资源或想法的链接，那么这将是很好的！

I was unable to find any direction to solve this problem.. if u have any link to good resource or ideas how to - that would be good!

推荐答案

一个选项：不要使用。您可以自己构建多边形并跟踪添加的标记。

One option: don't use the DrawingManager. Build the polygon yourself and keep track of the markers added.

var poly;
var map;

function initialize() {
  var polyOptions = {
      strokeColor: '#000000',
      strokeOpacity: 1.0,
      strokeWeight: 3, map: map
    };
  poly = new google.maps.Polygon(polyOptions);
  var bounds = new google.maps.LatLngBounds();
  map = new google.maps.Map(document.getElementById('map_canvas'), {
    center: new google.maps.LatLng(10.9386, -84.888),
    zoom: 10,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  });
  var evtListnr = google.maps.event.addListener(map,"click",function(evt) {
    bounds.extend(evt.latLng);
    addLatLng(evt);
    if (poly.getPath().getLength() == 5) {
      google.maps.event.removeListener(evtListnr);
    }
  });    

  poly.binder = new MVCArrayBinder(poly.getPath());

  poly.setMap(map);
} 

这篇关于谷歌地图api v3 - 如何限制多边形线的数量和强制关闭在5点击？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！