如何在Open layer 3中隐藏和显示功能？(重绘？)

Question

我正在将项目从OL2更新到OL3,但是在改变功能样式后我仍然坚持如何重绘功能.

在OL2中,这有效:

hidePoints: function(id) {
    if (! this.getMap().center) {
        return;
    }

    var i,
    feature,    
    len = this.points.features.length;

   if (id !== null) {
    for( i = 0; i < len; i++ ) {         
      feature = this.points.features[i];
      if (feature.attributes.aces_id == id) {
          feature.style = null;
        } else {
            feature.style = { display: 'none' };
        }
      }
   } else {
      for( i = 0; i < len; i++ ) {         
        feature = this.points.features[i];
        feature.style = { display: 'none' };
      }
   }
 this.points.redraw();
},

在OL3中,我尝试更新函数以隐藏点图层,但redraw()不再存在,因为我正在使用的图层是ol.layer.Vector,我找不到任何updateParams选项,就像其他源代码一样有.调度事件和更改也没有奏效.我希望改变,但没有任何反应.

hidePoints: function(id) {
    if (! this.getMap().getView().getCenter()) {
        return;
    }

    var i,
        feature,
        layerSourceFeatures = this.pointsLayer.getSource().getFeatures(),
        len = layerSourceFeatures.length;

    if (id !== null) {
        for( i = 0; i < len; i++ ) {
            feature = this.pointsLayer.getSource().getFeatures()[i];

            if (feature.get('aces_id') == id) {
                feature.style = null;
            } else {
                feature.style = { display: 'none' };
            }
        }
    } else {
        for( i = 0; i < len; i++ ) {
            feature = this.pointsLayer.getSource().getFeatures()[i];
            feature.style = { display: 'none' };
        }
    }
    //this.pointsLayer.redraw();
    //this.pointsLayer.dispatchEvent(goog.events.EventType.CHANGE);
    this.pointsLayer.changed();
},

我也想知道改变风格是否以这种方式完成(将每个特征提取到另一个var)或者是否不仅仅改变了该特征并保持原始状态不变.另外总是提取getSource().getFeatures()似乎对性能有辱骂......但我似乎无法找到另一种方式.

无论如何,现在如何在OL3中执行重绘以渲染样式已被更改的功能？图层可以设置为可见,但我不想一直隐藏/显示所有功能.有时我只是想隐藏/显示一些根据他们给定的id.

Answer 1

另一种方法是在该功能上使用样式函数和隐藏属性:

var style = new ol.Style(...);

function Stylefunction (feature, resolution) {
    var prop = feature.getProperties();
    if (prop.HIDDEN)
       return;

    return style;
}

var layer = new ol.layer.Vector({
    source: new ol.source.Vector(...),
    style: Stylefunction 
});

如果您更改"HIDDEN"功能,它会立即刷新