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>（旧/新）和1 / resFactor <（旧/新）。 如果将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();

}