openlayers：重绘矢量图层而不再重新下载数据

Question

我需要的是一种修改矢量图层表示而无需再次下载数据的方法。 我已经定义了一个GLM矢量图层和一个名为build_style的函数，用于根据某些特征为其几何图形着色。我有一个HTML表单调用函数UpdateGlmLayer，它以这种方式定义：

function UpdateGlmLayer(info_str) {
    var v = info_str.split("|");
    var filter_column = v[0];
    var values = [parseFloat(v[1]), parseFloat(v[2]), parseFloat(v[3])];
    glm.styleMap = build_style(filter_column, values);
    glm.redraw();
};

GLM层以这种方式定义：

gml_protocol = new OpenLayers.Protocol.HTTP({
    url: "http://localhost:8080/geoserver/ows?service=WFS&version=1.0.0&request=GetFeature&typeName="+info["layer_featurePrefix"]+":"+info["layer_featureType"],
    format: new OpenLayers.Format.GML()
})

glm = new OpenLayers.Layer.Vector(info["layer_name"], {
    strategies: [new OpenLayers.Strategy.BBOX({ratio: 3, resFactor: 1})],
    protocol: gml_protocol,
    styleMap: build_style(info["filter_property"], info["filter_values"]), 
    srsName: info["layer_srsName"],
    projection: new OpenLayers.Projection("EPSG:4326"),
    visibility: true
});

当触发UpdateGlmLayer时，颜色似乎立即发生变化，但之后系统停止的时间与初始页面加载下载数据的时间大致相同。在此期间什么都做不了。有什么不对吗？

Answer 1

问题在于您设置resFactor。我创建了两个演示映射，一个加载了一些GeoServer GML向量，并在不使用resFactor 1设置的情况下重新设置它们，另一个使用resFactor 1设置，第二个肯定是发送多个请求。如果将resfactor设置为大于1的任何值，则不会发生这种情况。

没有resFactor设置+点击restyle 3次会得到以下结果：

只有1个数据请求。

但是，resFactor设置3 +点击restyle 3次会得到以下结果：

4个数据请求。

我相信这是你所看到的行为。这看起来像是一个错误，因为文档说你所做的是有效的。查看BBOX策略js文件中的代码，问题似乎出现在代码中：

var ratio = this.resolution / this.layer.map.getResolution();
invalid = (ratio >= this.resFactor || ratio <= (1 / this.resFactor));

这是在.redraw（）函数上运行，以计算是否需要重新加载数据。因为当您重绘地图时，比率将始终设置为1（分辨率未更改，因此this.resolution === this.layer.map.getResolution（））则无效将始终等于true，因此图层重新加载

  

resFactor

     

{Float}用于确定之前请求的可选因子   功能无效。如果设置，resFactor将与   解析当前地图分辨率的先前请求。如果   resFactor＆gt; （旧/新）和1 / resFactor＆lt; （老新）。如果你设置了   resFactor为1，每次分辨率都会请求数据   变化。如果将resFactor设置为3，则会请求数据   旧分辨率是新分辨率的3倍，或者如果新分辨率是旧分辨率的3倍。   如果旧边界不包含新边界，则新数据将始终存在   被要求（有或没有考虑resFactor）。

我正在按照以下方式进行重新设计：

var style1, style2;


style1 = new OpenLayers.Style({
                strokeColor: "yellow",
                strokeWidth: 10 });


style2 = new OpenLayers.Style({
                strokeColor: "blue",
                strokeWidth: 5 });

function restyle1()
{
    layer.styleMap = style1;
    layer.redraw();

}

function restyle2()
{
    layer.styleMap = style2;
    layer.redraw();

}