SuperMap iClient for Openlayers 实现WFS查询功能

SuperMap iClient for classic已经实现对接WFS服务,可以对WFS进行查询并展示出查询的结果,但是官网范例中,目前没有关于Openlayers客户端的示例,在此文章中将简单介绍iClient for Openlayers如何实现WFS查询功能。

前期准备

  1. WFS服务地址,此次使用的地址是SuperMap官方的wfs服务地址:“http://support.supermap.com.cn:8090/iserver/services/data-world/wfs100”;
  2. 引用的js文件有include-openlayers.js,jquery.min.js和SuperMap-8.1.1-17226.js;

成果截图

在这里插入图片描述

图中红框内的小圆圈是定位在北京的查询结果,此次的查询范例实现的是根据SMID查询北京所在位置的功能。

主要代码实现过程


function loadWFS(){
				$.ajax({
					url:' http://support.supermap.com.cn:8090/iserver/services/data-world/wfs100',
					type:'POST',
					contentType: 'text/plain;charset=UTF-8', // 这里必须设置,否则会默认以form表单数据进行发送 
					traditional: true, 
					data: '<wfs:GetFeature xmlns:wfs="http://www.opengis.net/wfs" service="WFS" version="1.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://www.opengis.net/wfs http://schemas.opengis.net/wfs/1.0.0/WFS-transaction.xsd">'+
					'<wfs:Query typeName="World:capital" xmlns:World="http://www.supermap.com/World">'+

							'<wfs:PropertyName>SMY,SMX,SMUSERID,SMLIBTILEID,SMID,SMGEOMETRYSIZE,COUNTRY,CAP_POP,CAPITAL,the_geom</wfs:PropertyName>'+

							'<ogc:Filter xmlns:ogc="http://www.opengis.net/ogc">'+

							'<ogc:PropertyIsEqualTo xmlns:ogc="http://www.opengis.net/ogc">'+

							'<ogc:PropertyName>SMID</ogc:PropertyName>'+

							'<ogc:Literal>170</ogc:Literal>'+

							'</ogc:PropertyIsEqualTo>'+

							'</ogc:Filter>'+

							'</wfs:Query>'+

							'</wfs:GetFeature>',
					success:loadWFSHandler,
					error:function (rst) {
						console.log('request error.')
						}
				})
				
			function loadWFSHandler(gmlString){
				var GMLRead= new SuperMap.Format.GML().read(gmlString);//读取GML格式的数据
				var geoJsonString = new SuperMap.Format.GeoJSON().write(GMLRead,false);//将GML格式的数据写成GeoJSON格式
				var point=JSON.parse(geoJsonString);//解析GeoJSON格式的数据为JavaScript对象
				var vectorSource = new ol.source.Vector({
					features: (new ol.format.GeoJSON()).readFeatures(point)
				});	//将数据显示在地图上
				var vectorLayer = new ol.layer.Vector({
					source: vectorSource
				});
				map.addLayer(vectorLayer);
				}

ogc:Filter的过滤参数用来设置查询限制条件,空间的或非空间的限制条件都可以进行设置,可用来限制 GetFeature 操作的结果,即要素结果集。本次示例中使用的是PropertyIsEqualTo,即PropertyName字段的值等于Literal的情况。

小结

本次范例的演示只是基于WFS的查询功能,对于WFS来说可以做到增删改查的功能,基于本范例的代码稍作更改可以实现。

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值