openlayers如何检测标记是否在多边形内

Question

Does anyone know if there is an easy way to detect if a marker is within a defined boundary?

thanks

Answer 1

I'm assuming you are using OL v2.

On one side, the marker requires you to specify a OpenLayers.LonLat object. On the other hand, you can define any boundary with the OpenLayers.Bounds class and then check if it contains the marker LonLat with containsLonLat method. (check http://dev.openlayers.org/releases/OpenLayers-2.13.1/doc/apidocs/files/OpenLayers/BaseTypes/Bounds-js.html ).

In the same way if you work with geometries like points, linestring, etc you have methods like intersect to check this.

Answer 2

i have sample code done by me which check marker point is in within polygon or not.

function init() {

        map = new OpenLayers.Map("mapdiv");
        map.addLayer(new OpenLayers.Layer.OSM());

        epsg4326 = new OpenLayers.Projection("EPSG:4326"); //WGS 1984 projection
        projectTo = map.getProjectionObject(); //The map projection (Spherical Mercator)
        epsg900913 = new OpenLayers.Projection("EPSG:900913");

        var lonLat = new OpenLayers.LonLat(lon, lat).transform(epsg4326, projectTo);

        map.setCenter(lonLat, zoom);
        map.addControl(new OpenLayers.Control.MousePosition());
        var vectorLayer = new OpenLayers.Layer.Vector("Overlay");

        var point = new OpenLayers.Geometry.Point(lonLat.lon, lonLat.lat);

        var myPolygon = OpenLayers.Geometry.Polygon.createRegularPolygon
        (
            point,
            5000,
            4,
            0
        );

        var featurecircle = new OpenLayers.Feature.Vector(myPolygon);
        var markers = new OpenLayers.Layer.Markers( ".\marker.png" );
            map.addLayer(markers);
            markers.addMarker(new OpenLayers.Marker(lonLat));

        controls = {

                drag: new OpenLayers.Control.DragFeature(vectorLayer, {
                     autoActivate: true,
                     onComplete: displayBounds
                  })

                  //new OpenLayers.Control.DragFeature(vectorLayer)
            };

            for(var key in controls) {
                map.addControl(controls[key]);
            }

        var featurePoint = new OpenLayers.Feature.Vector(
            point,
            { description: 'info' },
            { externalGraphic: 'img/marker.png', graphicHeight: 25, graphicWidth: 21, graphicXOffset: -12, graphicYOffset: -25 }
        );

        vectorLayer.addFeatures([featurecircle]);
        for(key in controls) {
                var control = controls[key];
                control.activate();
                }
                var bounds = vectorLayer.features[0].geometry.getBounds();

    function displayBounds(feature){
            var bounds = feature.geometry.getBounds();
            var lonlat = new OpenLayers.LonLat(lon, lat).transform(epsg4326,epsg900913);;


            if ((lonlat.lon < bounds.left) || (lonlat.lat > bounds.top) || (lonlat.lat < bounds.bottom) ||(lonlat.lon > bounds.right) )
                {
                alert('out....');

                }

        }




        map.addLayer(vectorLayer);
  }

Answer 3

i solve this with

var poly = new OpenLayers.Geometry.Polygon([linearRing]);
                var polygonFeature = new OpenLayers.Feature.Vector(poly, null, siteStyle);
                map.addLayer(vectors);
                vectors.addFeatures([polygonFeature]);
var marker_point=new OpenLayers.Geometry.Point(lng,lat);
            var inside=poly.containsPoint(marker_point);
            if(inside)alert("Inside the polygon");