在 OpenLayers 中,您可以通过编写 WFS (Web Feature Service) 请求来查询地理要素。
以下是一个基本的步骤指南,用于从 GeoServer 或其他支持 WFS 的服务器上查询要素:
- 创建 ol.format.WFS 实例,并调用其 writeGetFeature 方法来构建 WFS 请求。
- 设置请求参数,包括投影坐标系、命名空间、特征类型、输出格式和过滤条件。
- 发送 POST 请求到 WFS 服务器,并处理响应。
- 解析响应数据,通常是 JSON 或 GML 格式,然后将解析后的特征添加到矢量源中。
- 更新地图视图以适应新添加的特征的范围。
示例代码片段
let featureRequest = new ol.format.WFS().writeGetFeature({
srsName: 'EPSG:3857', // 投影坐标系
featureNS: 'gistone', // 命名空间 URI
featurePrefix: 'gzq', // 工作区名称
featureTypes: ['sj'], // 查询图层,可以是同一个工作区下的多个图层,用逗号隔开
outputFormat: 'application/json', // 输出格式
filter: ol.format.filter.like('code', sfCode) // 过滤条件,例如模糊查询
});
fetch('http://localhost:8080/geoserver/gzq/wfs', {
method: 'POST',
body: new XMLSerializer().serializeToString(featureRequest)
})
.then(response => response.json())
.then(data => {
if (data.totalFeatures !== 0) {
console.log(data);
let vectorSource = new ol.source.Vector();
let features = new ol.format.GeoJSON().readFeatures(data);
vectorSource.addFeatures(features);
let extent = ol.proj.transformExtent(vectorSource.getExtent(), 'EPSG:4326', 'EPSG:3857');
map.getView().fit(extent);
}
});
上述代码中,sfCode 是您希望在 code 字段中进行模糊匹配的值。您需要根据实际情况替换 'http://localhost:8080/geoserver/gzq/wfs' 为您的 WFS 服务器的 URL,以及 'gistone', 'gzq', 'sj' 等参数为您的实际命名空间、工作区名称和查询图层名称。