基于属性值的样式特征

Question

基于attributes/properties的一种风格特征如何？目前我正在做以下事情：

olLayer = new ol.layer.Vector( {
  source: new ol.source.Vector( {
    features: featureArray
  } ),
  style: ( function() {

    var styleR3 = new ol.style.Style( {
      image: new ol.style.Circle( {
        radius: 10,
        fill: new ol.style.Fill( {
          color: 'blue'
        } )
      } )
    } );

    var styleCatchAll = new ol.style.Style( {
      image: new ol.style.Circle( {
        radius: 5,
        fill: new ol.style.Fill( {
          color: 'red'
        } )
      } )
    } );

    return function( feature, resolution ) {
      if ( feature.attributes[ "Rank" ] === "3" ) {
        return styleR3;
      } else {
        return styleCatchAll;
      }
    };

  }() )
} );

select 功能确实有效，但未应用 styleR3。

Answer 1

这里是...http://jsfiddle.net/jonataswalker/g3s96auc/

style函数在return上需要一个array，而你用的是自执行函数，不知道行不行，反正[=11] =] 函数变为：

style: function(feature, resolution){
    var styleR3 = new ol.style.Style( {
        image: new ol.style.Circle( {
            radius: 10,
            fill: new ol.style.Fill( {
                color: 'blue'
            } )
        } )
    } );

    var styleCatchAll = new ol.style.Style( {
        image: new ol.style.Circle( {
            radius: 5,
            fill: new ol.style.Fill( {
                color: 'red'
            } )
        } )
    } );

    if ( feature.get('rank') == 3) {
        return [styleR3];
    } else {
        return [styleCatchAll];
    }
}

基于属性值的样式特征

Styling features based on attribute values

openlayers-3