2017-07-28 167 views
0

我有一个搜索表单调用Solr的索引,充满geolocations:的OpenLayers 3新ol.Vector返回[无限,无穷远,-Infinity,-Infinity]

jQuery('.form-submit', element).click(function (e) { 
 
    e.preventDefault(); 
 
    search(); 
 
}); 
 

 
function search() { 
 
    useBBOX = false; 
 

 
    combinedExtent = ol.extent.createEmpty(); 
 
    data.map.getLayers().forEach(function (layer, index, array) { 
 
     if (layer.getSource() instanceof ol.source.Vector) { 
 
      var source = layer.getSource().getSource(); 
 
      var url = data.opt.urls[source.get('machineName')]; 
 
      var newSource = new ol.source.Vector({ 
 
       loader: getLoader(data, url), 
 
       format: new ol.format.GeoJSON(), 
 
       strategy: ol.loadingstrategy.bbox, 
 
       reloadOnZoomChange: true, 
 
       reloadOnExtentChange: true 
 
      }); 
 

 
      newSource.set('machineName', source.get('machineName')); 
 
      var newCluster = new ol.source.Cluster({ 
 
       source: newSource, 
 
       distance: 200 
 
      }); 
 
      layer.setSource(newCluster); 
 
     } 
 
    }); 
 
} 
 

 
function getLoader(data, url) { 
 
    return function (extent, resolution, projection) { 
 
     var bbox = ol.proj.transformExtent(extent, data.map.getView().getProjection(), 'EPSG:4326'); 
 

 
     var params = {}; 
 
     if (data.opt.paramForwarding) { 
 
      var get_params = location.search.substring(location.search.indexOf('?') + 1).split('&'); 
 
      jQuery.each(get_params, function (i, val) { 
 
       if (val.length) { 
 
        var param = val.split('='); 
 
        
 
        params[decodeURIComponent(param[0])] = (param[1] !== undefined) ? decodeURIComponent(param[1].replace(/\+/g, ' ')) : ''; 
 
       } 
 
      }) 
 
     } 
 

 
     if (useBBOX == true) { 
 
      params.bbox = bbox.join(','); 
 
      params.zoom = data.map.getView().getZoom(); 
 
     } 
 
     var searchQuery = jQuery('#input-search-address').val(); 
 

 
     if (searchQuery != 'undefined' && searchQuery != null) { 
 
      url = url.substr(0, url.lastIndexOf("/") + 1); 
 
      url = url + searchQuery; 
 
     } 
 
     jQuery(document).trigger('openlayers.bbox_pre_loading', [{ 
 
      'url': url, 
 
      'params': params, 
 
      'data': data 
 
     }]); 
 

 
     var that = this; 
 
     jQuery.ajax({ 
 
      url: url, 
 
      data: params, 
 
      success: function (responsdata) { 
 
       
 
       var features = that.getFeaturesInExtent(extent); 
 
       jQuery(features).each(function (i, f) { 
 
        that.removeFeature(f); 
 
       }); 
 
       var format = new ol.format.GeoJSON(); 
 
       var features = format.readFeatures(responsdata, {featureProjection: projection}); 
 
       that.addFeatures(features); 
 
       that._loadingFeatures = false; 
 

 
       if (!ol.extent.isEmpty(that.getExtent())) { 
 
        combinedExtent = ol.extent.extend(combinedExtent, that.getExtent()); 
 
      
 
        if (useBBOX == false) { 
 
         useBBOX = true; 
 
        } 
 
       } 
 
      } 
 
     }); 
 
    }; 
 
}

基本上,它提取3层,每层包含一些标记。我想根据这些标记自动缩放地图。因此我正在寻找extent。该combinedExtent确实包含正确的程度......

enter image description here

...但是当我添加data.map.getView().fit(combinedExtent, data.map.getSize())getLoader功能,它不工作。我看起来只有一个范围被绘制在地图上。

每当我尝试登录该search()功能combinedExtent,我得到一个奇怪的错误...

enter image description here

谷歌告诉我,我不得不等待直到newSourcegetState()ready,但那并不奏效...... 所以,我正在寻找解决方案。我的猜测是使用阿贾克斯返回在getLoader ...

回答

0

我刚刚有这个问题,所以我有一个函数来听,直到源准备好并完成加载之前给予功能的计数(否则它会每次迭代更新日志)。只需更改我的源名称(任何含有“parcelquery”的变量),并希望它至少可以让您在正确的方向上。

var listenerKey = wfsSource_parcelquery.on('change', function(e) { 
if (wfsSource_parcelquery.getState() == 'ready') { //says source is done loading 
var featureCount = wfsSource_parcelquery.getFeatures().length; //getting number of features resulting from query 
ol.Observable.unByKey(listenerKey); 
// use vectorSource.unByKey(listenerKey) instead 
// if you do use the "master" branch of ol3 
} 
alert("Your query returned "+ featureCount + " results."); 
        var extent = lyr_parcelquery.getSource().getExtent();  
       console.log(extent);    
       map.getView().fit(extent, map.getSize()); 
});