javascript - 从 WFS/Geoserver 获取 JSON 数据

Question

我正在努力从我的 GeoServer 中的 WFS 获取数据。我想从 WFS 返回的 JSON 中获取特定属性，并在我的 html 页面中使用它来填充表格。我已经阅读了很多帖子和文档，但我似乎无法让它发挥作用。我有:

(a) 更改我的地理服务器文件夹中的 web.inf 文件以启用 jsonp

(b) 尝试组合输出格式(json 或文本/javascript)

(c) 尝试了不同的方法来解析 JSON(使用 . 或 []、JSON.parse 或 parseJSON 等)，

(d) 使用 JSON.stringify 测试 ajax 调用是否正常工作(确实如此!!)

但是，最后，它总是返回undefined!!

function wfs(longitude, latitude){
    function getJson(data) {
        var myVar1=data['avgtemp1'];
        document.getElementById("v1").innerHTML = myVar;
    }
    var JsonUrl = "http://88.99.13.199:8080/geoserver/agristats/wfs?service=wfs&version=2.0.0&request=GetFeature&typeNames=agristats:beekeeping&cql_filter=INTERSECTS(geom,POINT(" + longitude + " " + latitude + "))&outputFormat=text/javascript&format_options=callback:getJson";
    $.ajax({
        type: 'GET', 
        url: JsonUrl,
        dataType: 'jsonp',
        jsonpCallback:'getJson',
        success: getJson
    });
}
wfs(38, 23);

你能帮帮我吗？

Answer 1

你离它很近了。首先，您在编写的变量名称中有错字(myVar1 vs myVar)。其次，您的函数正在接收一个 Json 对象，因此您必须深入了解它的结构。首先你得到特征，然后是第一个，然后是属性数组，然后是你选择的属性。 我建议你读一篇 tutorial在 Json 对象上，因为您肯定希望遍历属性/项目，验证它们不为 null 等。

 function getJson(data) {
        var myVar1=data.features[0].properties['avgtemp1'];
        document.getElementById("v1").innerHTML = myVar1;
    }

最后，不要忘记在您喜欢的浏览器中使用调试器。在您的函数中放置一个断点并检查 data 的结构和内容。