Openlayersのベクターレイヤー内にバウンディングボックスがあるかどうかを調べる3

Question

私は、OSMマップ上の関心領域を描くために多くのポリゴンを含むベクトルレイヤーを持っています。ユーザーは、地図上に境界ボックスを描いて、特定の関心領域に関する詳細情報を得ることができます。私がチェックする必要があるのは、ユーザーが描画するバウンディングボックスがベクターレイヤーの多くのポリゴンの1つにあるかどうかです。 これはopenlayers 3で可能ですか？エクステントを比較することができますが、ベクターレイヤの範囲はマップ全体です。ボックスが小さな領域にあるかどうかを調べる必要があります。誰もが知っています....私は地域の座標に掘り、エクステントを比較しようとしましたが、それは配列の配列の配列、だ

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... 
} 

：

マップおよびベクトルを含む層にGeoJSONを設定しますbboxがRegionsレイヤーのいずれかのポリゴン内にあるかどうかを確認する良い方法はありますか？事前に

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

}

ありがとう：私は、それがこのように行われていたOpenLayersを-2ではOpenLayersを3.17.1

を使用しています！

Answer 1

これは何か？

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 */ 
     } 
    } 
}