zoukankan      html  css  js  c++  java
  • ol之filter过滤获取feature

    ol之filter过滤获取feature

    使用场景:

    通过geoserver的省界服务查询对应省的要素,定位到对应位置

    代码:       sfCode 为省份编码 

    queryLocation (sfCode) {
          let featureRequest = new ol.format.WFS().writeGetFeature({
            ssName: 'EPSG:3857',
            featureNS: 'gistone', // 命名空间 URI
            featurePrefix: 'njs', // 工作区名称
            featureTypes: ['sj'], // 查询图层,可以同一个工作区下多个图层,逗号隔开
            outputFormat: 'application/json',
            filter: ol.format.filter.like('code', sfCode)
          })
          fetch('http://localhost:8080/geoserver/njs/wfs', {
            method: 'POST',
            body: new XMLSerializer().serializeToString(featureRequest)
          }).then((res) => {
            return res.json()
          }).then(res => {
            if (res.totalFeatures !== 0) {
              let vectorSource = new ol.source.Vector()
              let features = new ol.format.GeoJSON().readFeatures(res)
              vectorSource.addFeatures(features)
              let extent = ol.proj.transformExtent(vectorSource.getExtent(), 'EPSG:4326', 'EPSG:3857')
              this.view.fit(extent)
            }
          })
        },
    

    注意事项:

    1.在查询字段设置错误时,可能会报错:   json格式不正确 <

    2.地图服务中字段名和查询字段中的数据不能为中文。

    3.‘http://localhost:8080/geoserver/njs/wfs’中njs为工作空间名称

    钻研不易,转载请注明出处、、、、、、

  • 相关阅读:
    【leetcode】修剪二叉搜索树
    053-621
    053-620
    053-619
    053-618
    053-617
    053-616
    053-615
    053-614
    053-613
  • 原文地址:https://www.cnblogs.com/s313139232/p/12720677.html
Copyright © 2011-2022 走看看