如何知道标记是否在多边形内部

How to know if marker is inside in polygon?

本文关键字：多边形 内部 是否 何知道      更新时间：2023-09-26

我已经创建了一个多边形和可拖动标记，但我的问题是，如果标记在多边形中，它会警告"否"，应该是"是"？我的代码在这里：

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=drawing,geometry"></script>
    <script type="text/javascript">
        function initialize() {
            var coor = [];
            var mapOptions = {
              center: new google.maps.LatLng(7.0704771, 125.608522),
              zoom: 17,
              mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            var map = new google.maps.Map(document.getElementById("map-canvas"),
                mapOptions);
            var dragable_marker = new google.maps.Marker({
              position : new google.maps.LatLng(7.0704771, 125.608522),
              map : map,
              draggable : true,
              title: "Your customer location"
            });
            drawingManager = new google.maps.drawing.DrawingManager({
                drawingMode: google.maps.drawing.OverlayType.NONE,
                drawingControl: true,
                drawingControlOptions: {
                  position: google.maps.ControlPosition.TOP_CENTER,
                  drawingModes: [
                    //google.maps.drawing.OverlayType.MARKER,
                    google.maps.drawing.OverlayType.POLYGON
                  ]
                },
                markerOptions: {
                  icon: 'img/pin.png'
                },
                polygonOptions: {
                  fillColor: '#66d9ef',
                  fillOpacity: 0.5,
                  strokeColor: '#1A8BD6',
                  strokeWeight: 2,
                  clickable: true,
                  editable: false,
                  draggable: false,
                  zIndex: 1
                }
            });
            drawingManager.setMap(map);
            var created_poly = new google.maps.Polygon({path:coor,
                        map: map, 
                        strokeColor:"#0000FF",
                        strokeOpacity:0.8,
                        strokeWeight:2,
                        fillColor:"#0000FF",
                        fillOpacity:0.4
                    });
            google.maps.event.addListener(drawingManager, 'polygoncomplete', function(polygon) {
              drawingManager.setDrawingMode(null);
              var arr=[];
              polygon.getPath().forEach(
                function(latLng){
                  arr.push(latLng.toString());
                }
              )
              coor = arr.join(','n');
              drawingManager.setOptions({
                drawingControl: false,
              });
            });
            google.maps.event.addListener(dragable_marker,"dragend", function() {
              if(google.maps.geometry.poly.containsLocation(dragable_marker.getPosition(), created_poly) == true) {
               alert("yes"); // if marker is inside in polygon
              } else { 
                alert("no"); // if marker is outside in polygon
              }
            });
        }
        google.maps.event.addDomListener(window, 'load', initialize);
    </script>
    <style type="text/css">
        #map-canvas{
            height: 300px;
        }
    </style>
<body>
    <div id="map-canvas"></div>
</body

我的错误是什么？

解决这一问题的一种算法是多边形中的点。查看解释http://en.wikipedia.org/wiki/Point_in_polygon

您可以在这里找到实现Google Maps JS API V3的代码：https://github.com/tparkin/Google-Maps-Point-in-Polygon

相关文章：