gpt4 book ai didi

javascript - 无法第二次设置 WFS 过滤器

转载 作者:数据小太阳 更新时间:2023-10-29 05:32:55 27 4
gpt4 key购买 nike

这是我的场景。页面加载并加载带有空矢量图层的 map 。所以它在那里,但没有任何功能。然后用户点击一个按钮,CQL 过滤器根据 CQL 设置加载特征。

我实现它的方法。我设置了一个空的矢量图层,没有loaderstrategy。用户第一次单击的按钮调用“初始化”函数 (=firstTimeOnly()),该函数:

  • 为向量层设置一个loader和一个strategy

  • 现在 loader 存在,调用另一个“过滤”函数 (=changeFilter())
    重置加载程序的 cql 过滤器并加载功能

  • 现在“过滤”功能附加到按钮并被调用
    每次点击。 “初始化”功能达到了目的
    并与按钮分离。

这是我的代码

<button id= "magicButton", onclick="firstTimeOnly()">Click me</button>

//set globals to use them
var cqlFilter = "name='testpoint9'";
var urlTemplate = 'http://localhost:5550/geoserver/mymap/wfs?service=WFS&version=1.0.0&request=GetFeature&typeName=mymap:layerName&CQL_FILTER={{CQLFILTER}}&outputFormat=application/json';
var loader = function (extent) {
var url = urlTemplate.replace('{{CQLFILTER}}', cqlFilter);
$.ajax(url, {
type: 'GET',
success: function(response) {
var res = response;
var geojsonFormat = new ol.format.GeoJSON();
sourceVector.addFeatures(geojsonFormat.readFeatures(response));
}
})
};

var strategy = new ol.loadingstrategy.tile(ol.tilegrid.createXYZ({maxZoom: 20}));

//empty vector source
var sourceVector = new ol.source.Vector({});

function changeFilter() {
//remove all, set cql and reload
var featsToRemove = layerVector.getSource().getFeatures();
for (var f=0;f<featsToRemove.length;f++)
{
layerVector.getSource().removeFeature(featsToRemove[f]);
}
cqlFilter = "name LIKE 'p'";
sourceVector.clear(true);
}

layerVector = new ol.layer.Vector({
source: sourceVector,
style:styleFunction
});

function firstTimeOnly() {
sourceVector.set('loader', loader);
sourceVector.set('strategy', strategy);
changeFilter();
document.getElementById("magicButton").removeEventListener("click", firstTimeOnly, false);
document.getElementById("magicButton").addEventListener("click", changeFilter, false);
}

这是基于 erilem's code对于 cql 过滤器重置,如果我只使用他的代码就可以正常工作。但是如果我想从一个空层开始并像上面那样编辑它,我什么也得不到。我的代码没有错误。但是,如果我点击按钮,我什么也得不到。

请告诉我如何解决这个问题。或者这可能是矫枉过正,您建议采用更聪明的方法。

谢谢

更新

如果我放

console.log("loader"+sourceVector.get('loader'));

在 changeFilter 的末尾,我得到了加载器函数。所以,我猜我第一次点击按钮时,firstTimeOnly 实际上设置了一个加载器并调用了 changeFilter。那么,装载机在那里,但不工作?有帮助吗?

最佳答案

在不涉及 Openlayers 的潜在问题的情况下,我看到的问题是 removeEventListener 仅适用于删除使用 addEventListener 设置的监听器。由于您在 HTML 中以声明方式绑定(bind)了 onclick,因此解除绑定(bind)的方法是执行 document.getElementById("magicButton").onclick = null

也就是说,我会更改您的示例,以便在您的代码中的某处使用 addEventListener 设置事件监听器。

例子:

function firstTimeOnly() {
sourceVector.set('loader', loader);
sourceVector.set('strategy', strategy);
changeFilter();
document.getElementById("magicButton").removeEventListener("click", firstTimeOnly, false);
document.getElementById("magicButton").addEventListener("click", changeFilter, false);
}
document.getElementById("magicButton").addEventListener("click", firstTimeOnly, false);

并去掉 HTML 中的 onclick

同时考虑缓存对 magicButton 的引用,这样您就不必经常调用 getElementById

var magicButton = document.getElementById("magicButton");

关于javascript - 无法第二次设置 WFS 过滤器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33485692/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com