在 Openlayers 样式中切换填充颜色答案

【问题标题】：toggle fill Color in Openlayers style在 Openlayers 样式中切换填充颜色
【发布时间】：2012-10-10 04:42:30
【问题描述】：

我想为 Openlayers 中的特定图层切换点的填充颜色？有可能这样做吗？眨眼之类的？

fillColor:${getFillColor},
context : {
  getFillColor : function(feature) {
    if (feature.data.fillColor == 'red') {
      return 'yellow';
    } else {
      return 'red';
    }

不工作

【问题讨论】：

标签： openlayers

【解决方案1】：

即使没有基于上下文的样式，您也应该能够完成该任务；您只需要定期更改矢量图层的样式并重新绘制即可。尝试类似：

window.setInterval(function (){
    var defaultStyle = yourVectorLayer.styleMap.styles['default'].defaultStyle;
    yourVectorLayer.styleMap.styles['default'].defaultStyle = {
        fillColor: defaultStyle.fillColor === 'blue' ? 'green' : 'blue',
        pointRadius: 10
    }
    yourVectorLayer.redraw();
}, 1000);

下面是一个完整的工作示例

var map = new OpenLayers.Map('map', {
    maxResolution:'auto',
    layers: [
        new OpenLayers.Layer.WMS( 
            "OpenLayers WMS",
            "http://vmap0.tiles.osgeo.org/wms/vmap0",
            {layers: 'basic'}
        ),
        new OpenLayers.Layer.Vector('Points', {
            styleMap: new OpenLayers.StyleMap({
                pointRadius: 10, 
                fillColor: "blue"
            })
        })
    ],
    center: [0,0]
});

var features = [];
for (var i=0; i<100; i++) {
    var x = Math.random() * 360 - 180,
        y = Math.random() * 180 - 90;
    features.push(
        new OpenLayers.Feature.Vector(
            new OpenLayers.Geometry.Point(x, y)
        )
    );
}

map.layers[1].addFeatures(features);

window.setInterval(function(){
    var defaultStyle = map.layers[1].styleMap.styles['default'].defaultStyle;
    map.layers[1].styleMap.styles['default'].defaultStyle = {
        fillColor: defaultStyle.fillColor === 'blue' ? 'green' : 'blue',
        pointRadius: 10
    }
    map.layers[1].redraw();
}, 1000);

【讨论】：

这在我点击地图添加一个点时有效。但是，如果该点以编程方式设置，则项目符号显示为黄色，按照默认设置。