Openlayers2图层加载(三)使用WFS方式加载矢量图层

加载WFS图层

上一篇加载的图层是以文件形式存在的,而实际项目应用中,矢量数据通常是存储在数据库中,通过请求来获取数据,在装载到矢量图层中。
WFS是OGC开放联盟制定的一种标准地图服务协议,支持通过WFS请求来获取矢量数据,对数据进行操作等。
以下代码实现将WFS请求到陕西省范围,加载到地图上。
示例:

function initMap(){
	var map,baseLayer	
	map = new OpenLayers.Map("map");

	baseLayer = new OpenLayers.Layer.WMS(
			"basic",
			"http://localhost:8080/geoserver/chinaNS/wms",
			{
                layers: "chinaNS:shengjie"
			},
			{isBaseLayer:true}
    );

    //定义wfs请求
    var protocolObj = new OpenLayers.Protocol.WFS({
        url:"http://localhost:8080/geoserver/chinaNS/wfs",
        featureType: "shengjie",//这里图层名之前不能带工作空间名
        geometryName: "the_geom"
    });

    //定义过滤条件
    var filterObj = new OpenLayers.Filter.Comparison({
        type: OpenLayers.Filter.Comparison.EQUAL_TO,
        property: "NAME",
        value: "陕西省"
    });

    //定义图层样式
    var styles = new OpenLayers.StyleMap({
        fillColor: "#F4FA58",
        strokeColor: "#FF8000",
        strokeWidth: 1
    })

    //定义wfs图层
    var wfsLayer = new OpenLayers.Layer.Vector(
        'vector',
        {
            strategies: [new OpenLayers.Strategy.BBOX()],
            protocol: protocolObj,
            styleMap: styles,
            filter: filterObj
        }
    );

	map.addLayers([baseLayer,wfsLayer]);
	map.setCenter(new OpenLayers.LonLat(108, 34), 4);
}

结果
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/u012413551/article/details/84146478