从 WFS/Geoserver 获取 JSON 数据

Question

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

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

(b) 尝试组合输出格式（json 或 text/javascript）

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

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

但是，最后，它总是 returns 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 对象，因此您必须深入研究它的结构。首先你得到特征，然后是第一个，然后是属性数组，然后是你选择的属性。我建议您阅读关于 Json 对象的 tutorial，因为您肯定想要遍历 properties/items，验证它们不为 null 等

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

最后，别忘了在您喜欢的浏览器中使用调试器。在您的函数中放置一个断点并检查 data.

的结构和内容

从 WFS/Geoserver 获取 JSON 数据

Get JSON data from WFS/Geoserver

javascript

ajax

jquery

json

geoserver