Geoserver+Ajax 请求服务（空间、属性查询及添加图层服务）

最新推荐文章于 2024-08-06 11:24:45 发布

鸽子fly

最新推荐文章于 2024-08-06 11:24:45 发布

阅读量631

点赞数

分类专栏： geoserver 文章标签： ajax

本文链接：https://blog.csdn.net/weixin_43224584/article/details/115392154

版权

geoserver 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

这篇博客介绍了如何在WebGIS中进行属性查询和空间查询。首先，通过AJAX调用WFS服务，使用CQL_FILTER进行属性查询，以特定机构名称匹配图层特征并获取边界。然后，利用几何对象的contains方法进行空间查询，判断点是否在几何对象内。最后，展示了如何获取并加载WMS图层服务，设置图层显示层级并添加到地图中。

摘要由CSDN通过智能技术生成

一、过滤不为Geometry字段时属性查询：

   function getBoundary(JIGOU_MC) {
            var data = {
                "service": "wfs",
                "version": "1.1.0",
                "request": "GetFeature",
                "typeName": layer,//图层
                "outputFormat": "application/json",
                "cql_filter": "NAME LIKE '%" + JIGOU_MC + "%'"
            };
            $.ajax({
                url: url,//wfs服务地址
                data: data,
                type: "GET",
                contentType: "text/plain;charset=UTF-8",
                success: function (data) {
                    var features = new ol.format.GeoJSON().readFeatures(data);
                    if (features.length > 0) {
                        var extent = features[0].getGeometry().getExtent();
                        map.getView().fit(extent, {
                            size: map.getSize(),
                            duration: 500
                        });
                    } else {
                        alert('没有查询到机构所在行政区！');
                    }
                },
                error: function (data) {
                    alert('没有查询到机构所在行政区！');
                }
            });
        }

二、空间查询：

  function getBoundary( x, y) {
            var data = {
                "service": "wfs",
                "version": "1.1.0",
                "request": "GetFeature",
                "typename": layer,
                "outputformat": "application/json",
                "cql_filter": "CONTAINS(SHAPE,SRID=4326;POINT(" + x + " " + y + "))"
            };
            $.ajax({
                url: url,
                data: data,
                type: "GET",
                contentType: "text/plain;charset=UTF-8",
                success: function (data) {
                    var features = new ol.format.GeoJSON().readFeatures(data);
                }
            });
        }

三、获取图层服务：

  var wmsSource = new ol.source.TileWMS({
                url: url,
                params: {
                    'FORMAT': 'image/png',
                    'VERSION': '1.1.1',
                    tiled: true,
                    "LAYERS": layers,
                    "exceptions": 'application/vnd.ogc.se_inimage',
                },
                serverType: 'geoserver',
                crossOrigin: 'anonymous',
            });

            var wmsLayer = new ol.layer.Tile({
                source: wmsSource,
                zIndex: index//图层显示层级
            });
            map.addLayer(wmsLayer);```