找出一个边界框是否在openlayers 3

时间:2016-08-30 17:33:04

标签: openlayers openlayers-3 bounding-box

我有一个矢量图层,其中包含许多多边形,以勾勒出OSM地图上感兴趣的区域。用户可以在地图上绘制边界框以获得关于特定感兴趣区域的更多信息。我需要检查的是,用户绘制的边界框是否在我的矢量图层中的多个多边形之一内。 在openlayers 3中这可能吗?我发现我可以比较范围,但我的矢量图层的范围是整个地图。我需要找出盒子是否位于较小的区域内。

设置包含geojson的地图和矢量图层:

map = new ol.Map({
        interactions: ol.interaction.defaults({
            keyboard: false,
            altShiftDragRotate: false
        }),
        target: 'create-export-map',
        view: new ol.View({
            projection: "EPSG:4326",
            //extent: [-180,-90,180,90],
            center: [44.4333, 33.3333],
            zoom: 4,
            maxZoom: 18,
        })
    })


    //add base layers
    var osm = new ol.layer.Tile({
        title: "OpenStreetMap",
        source: new ol.source.OSM({
            wrapX: false,
            noWrap: true,
            attributions: [
                new ol.Attribution({
                    html: '&copy ' +
                    '<a href="//www.openstreetmap.org/copyright">OpenStreetMap</a> contributors.'
                }),

                ol.source.OSM.ATTRIBUTION
            ]

        })
    })

    map.addLayer(osm);

regionsSource = new ol.source.Vector({
        wrapX: false,
        noWrap: true,
    });


    regions = new ol.layer.Vector({
            name: 'regions',
            source: regionsSource,
            style: new ol.style.Style({
                fill: new ol.style.Fill({
                    color: 'rgba(0,0,0,0)',
                    //opacity: 0.8,
                }),
                stroke: new ol.style.Stroke({
                    color: 'rgba(215, 63, 63, 0.8)',
                    width: 3.5,
                })
            }),

        })
    map.addLayer(regions);

$.getJSON(jsonfileURL, function(data){
        var geojson = new ol.format.GeoJSON();
        var features = geojson.readFeatures(data);
        regionsSource.addFeatures(features);
        var extent = regionsSource.getExtent();

        map.getView().fit(extent, map.getSize());            
    });

//OL3 add bounding box selection layer
    bboxSource = new ol.source.Vector()
    bbox = new ol.layer.Vector({
        name: 'Select',
        source: bboxSource,
        style: new ol.style.Style({
            stroke: new ol.style.Stroke({
                color: 'blue'
            }),
            fill: new ol.style.Fill({
                color: [0, 0, 255, 0.05]
            })
        })
    });
    map.addLayer(bbox);

//Map control for dragbox - bounding box
var dragBox = new ol.interaction.DragBox({
        condition: ol.events.condition.primaryAction,
    });

    var translate;

    dragBox.on('boxend', function(e){
        var dragFeature = new ol.Feature({
            geometry: dragBox.getGeometry()
        });
        bboxSource.addFeature(dragFeature);
        map.removeInteraction(dragBox);
        translate = new ol.interaction.Translate({
            features: new ol.Collection([dragFeature])
        });

        var bounds = dragFeature.getGeometry().getExtent();
        filtering = true;

        // validate the selected extents
        if (validateBounds(bounds)) {
            setBounds(bounds);
        }
        else {
            unsetBounds();
        }

function validateBounds(bounds) {
    var regions, region;
    map.getLayers().forEach(function (l) {
        if (l.get('name') == 'regions')
            regions = l;
    })

    var valid_region = false;

    // check that we're within a polygon region.
    //This is where I'm stuck...
}

我试过比较范围,挖掘区域的坐标,但它是一个阵列阵列,数组......有没有人知道检查是否有好的方法bbox会在Regions图层中的一个多边形内吗?我使用的是OpenLayers 3.17.1

在openlayers-2中它是这样完成的:

for (i = 0; i < regions.length; i++){
        region = regions[i].geometry;
        if (extent.intersects(region)){
            valid_region = true;
        }

}

提前致谢!

1 个答案:

答案 0 :(得分:0)

这样的东西?

for (i = 0; i < regions.length; i++) {
    var region = regions[i];
    for (j = 0; j < region.getSource().getFeatures().length; j++) {
        var feature = regions.getSource().getFeatures()[j];
        if (ol.extent.intersects(extent,feature.getGeometry().getExtent())) {
            /* do whatever you want */
        }
    }
}