openlayers2 wfs方式加载矢量图层

来源：互联网发布：淘宝飞利浦官方旗舰店编辑：程序博客网时间：2024/05/23 01:22
在地图中为了增强交互效果，需要加载一层矢量地图。如何通过请求wfs的方式加载矢量地图呢？
function getParkingLayerFunc(mapUrl,parkingLayerName,onComplete){//获取地图对象var map = ****.getMap();//矢量图层默认状态下的stylevar defaultStyle = new OpenLayers.Style({'fontColor' : '#000000','rotation': 90,'strokeWidth' : 1,'strokeOpacity' : .5,'strokeColor' : ****.parkBorderColor,'fillColor' : ****.parkFillColor,'fillOpacity' : 1},{    rules: [            new OpenLayers.Rule({                maxScaleDenominator: 1690,                symbolizer: {                    pointRadius: 7,                    'label' : ''                }            }),            new OpenLayers.Rule({            maxScaleDenominator: 800,                symbolizer: {                'label' : '${number}',                    'fontSize': "7px"                }            }),            new OpenLayers.Rule({            maxScaleDenominator: 200,                symbolizer: {                'label' : '${number}',                    'fontSize': "20px"                }            })        ]    });//矢量图层选中状态下的stylevar selectedStyle = new OpenLayers.Style({'fontColor' : '#000000','strokeWidth' : 1,'strokeOpacity' : .5,'strokeColor' : "#000000",'fillColor' : ****.focusedColor,'fillOpacity' : 1},{    rules: [            new OpenLayers.Rule({            maxScaleDenominator: 1690,                symbolizer: {                    pointRadius: 7,                    'label' : ''                }            }),            new OpenLayers.Rule({                maxScaleDenominator: 800,                symbolizer: {                'label' : '${number}',                    fontSize: "7px"                }            }),            new OpenLayers.Rule({            maxScaleDenominator: 200,                symbolizer: {                'label' : '${number}',                    'fontSize': "20px"                }            })        ]    });// 建立矢量图层的stylevar hotStyle = new OpenLayers.StyleMap({"default" : defaultStyle,"select" : selectedStyle});var wfsParams = {service : 'WFS',version : '1.1.0',request : 'GetFeature',typeName : ****.mapSpace + ':' + parkingLayerName,maxFeatures : '1000',srsName : 'EPSG:4326',outputFormat : 'text/javascript',format_options : 'callback:parseResponse'};$._ajax({url : mapUrl+'/geoserver/parking/wfs',data : $.param(wfsParams),type : 'GET',jsonpCallback : 'parseResponse',dataType : 'jsonp',success : function(data) {****.parkingLayer = new OpenLayers.Layer.Vector("tingchewei", {eventListeners : {//'featureselected' : function(evt) {////},'featureunselected' : function(evt) {}},styleMap : hotStyle});****.parkingLayerFeature = new OpenLayers.Format.GeoJSON({}).read(data);****.selectedParkingFeature = new OpenLayers.Format.GeoJSON({}).read(data);****.parkingLayer.addFeatures(****.parkingLayerFeature, {});//****.parkingSelectControl = new OpenLayers.Control.SelectFeature(//****.parkingLayer, {//clickout: true, //            toggle: true,//            multiple: false, //            hover : false,////autoActivate : true,//toggleKey: "ctrlKey", // ctrl key removes from selection//                multipleKey: "shiftKey", // shift key adds to selection//                box: true//});//map.addControl(****.parkingSelectControl);//添加矢量矢量图层map.addLayer(****.parkingLayer);if(onComplete){onComplete();}}});}
0 0