简体   繁体   English

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

[英]How to know if marker is inside in polygon?

I already create a polygon and draggable marker, but my problem is if the marker is inside in the polygon, it will alert "NO", it should be "YES"? 我已经创建了一个多边形和可拖动标记,但是我的问题是,如果标记位于多边形内部,它将提示“否”,应该是“是”? My code is here: 我的代码在这里:

<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

What is my error? 我怎么了

One algorithm to solve this is point in polygon. 解决此问题的一种算法是多边形中的点。 See an explanation http://en.wikipedia.org/wiki/Point_in_polygon 查看说明http://en.wikipedia.org/wiki/Point_in_polygon

And you can find code implementing this for the Google Maps JS API V3 here: https://github.com/tparkin/Google-Maps-Point-in-Polygon 而且,您可以在此处找到为Google Maps JS API V3实现此功能的代码: https//github.com/tparkin/Google-Maps-Point-in-Polygon

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM