Geoserver + openlayer wfs
<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0″>
<meta name=”apple-mobile-web-app-capable” content=”yes”>
<title>Resize a Marker</title>
<link rel=”stylesheet” href=”theme/default/style.css” type=”text/css”>
<link rel=”stylesheet” href=”style.css” type=”text/css”>
<script src=”OpenLayers.js”></script>
<script src=”ext-all.js”></script>
<script type=”text/javascript”>
var map, layer;
var size, icon;
function init(){
var options = {
maxExtent: new OpenLayers.Bounds(-0.7493299999999999,-0.51983,0.50833,0.73783),
units: ‘m’,
projection: “EPSG:4326”
};
map = new OpenLayers.Map(‘map’,options);
layer = new OpenLayers.Layer.WMS( “MY WMS”,
“http://127.0.0.1:8080/geoserver/wms”,
{
layers: ‘Test:lamp_point123’
}
);
map.addLayer(layer);
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.addControl(new OpenLayers.Control.MousePosition());
map.zoomToMaxExtent();
var XML;
XML = ‘<?xml version=”1.0″ encoding=”UTF-8″?>’ ;
XML += ‘<wfs:GetFeature service=”WFS” version=”1.0.0″ outputFormat=”GML2″‘
XML += ‘ xmlns:topp=”http://www.openplans.org/topp”‘
XML += ‘ xmlns:wfs=”http://www.opengis.net/wfs”‘
XML += ‘ xmlns:ogc=”http://www.opengis.net/ogc”‘
XML += ‘ xmlns:gml=”http://www.opengis.net/gml”‘
XML += ‘ xmlns:xsi=”http://www.w3.org/2001/XMLSchema-instance”‘
XML += ‘ xsi:schemaLocation=”http://www.opengis.net/wfs’ + “/n”;
XML += ‘ http://schemas.opengis.net/wfs/1.1.0/WFS-basic.xsd”>’
//上面是查询用的gml的前缀
XML += ‘<wfs:Query typeName=”Test:lamp_point123″>’
XML += ‘<wfs:PropertyName>Test:LAMPID</wfs:PropertyName>’
XML += ‘</wfs:Query>’
XML += ‘</wfs:GetFeature>’;
var xmlPara = XML; //返回结果无法解析为gml？？-已解决（增加返回结果样式标签）
var request = OpenLayers.Request.POST({
url: “http://localhost:8080/geoserver/wfs?”,
data: xmlPara,
callback: onComplete
});
function onComplete(req)
{
var markers = new OpenLayers.Layer.Markers(“Markers”);
map.addLayer(markers);
alert(“req.responseText :” + req.responseText);
//openlayers的GML解析器
var gmlParse = new OpenLayers.Format.GML();//如果使用wfs1.1.0，则需要增加如下参数：{xy:false }//更改x，y坐标的读取顺序
var features = gmlParse.read(req.responseText);
var icon = new OpenLayers.Icon(‘images/pp.gif’);
var feature, lonlat, marker;
for(var feat in features){
alert(0);
feature = features[feat];
alert(1);
lonlat = new OpenLayers.LonLat(feature.geometry.x,feature.geometry.y);
alert(2);
marker = new OpenLayers.Marker(lonlat,icon.clone());
alert(3);
//此处注册了鼠标的点击事件，可以在mousedown中做些事情
marker.events.register(“mousedown”, marker, mousedown);
alert(4);
//markers为OpenLayers.Layer.Markers 画点的层
markers.addMarker(marker);
alert(5);
}
}
function mousedown(e)
{
alert(haha);
}
}
</script>
</head>
<body onLoad=”init()”>
<div id=”map” class=”smallmap”></div>
</body>
</html>
转载自：https://blog.csdn.net/hnzhangshilong/article/details/6924422
