http://localhost:8181/geoserver/wfs?request=GetFeature&typename=topp:states&maxfeatures=1&outputformat=json
POLYGON((-143.4375 17.578125, -123.75 -44.296875, -47.8125 -23.203125, -54.84375 27.421875, -56.25 27.421875, -143.4375 17.578125))
{"type":"Feature", "id":"OpenLayers.Feature.Vector_213", "properties":{}, "geometry":{"type":"Polygon", "coordinates":[[[-143.4375, 17.578125], [-123.75, -44.296875], [-47.8125, -23.203125], [-54.84375, 27.421875], [-56.25, 27.421875], [-143.4375, 17.578125]]]}, "crs":{"type":"EPSG", "properties":{"code":4326}}}
{ "features": [
{ "id": "alesia",
"title": "Alesia",
"classname": "settlement",
"geometryType": "point",
"spatialCoordinates": [[47.535, 4.478, 0.0]],
"srs": "EPSG:4326",
"center": [47.535, 4.478, 0.0]
}
]
}
{ "name": "map-1",
"title": "Pleiades Map 1",
"boundingBox": [-12.0, 32.0, 40.0, 58.0],
"srs": "EPSG:4326",
"layers": [
{ "name": "dphysio",
"title": "Demis Physiography",
"layers": "Bathymetry,Topography,Rivers,Waterbodies",
"styles": ",,,",
"onlineResource": "http:\/\/www2.demis.nl\/mapserver\/request.asp",
"srs": "EPSG:4326"
}
]
}
var map, vectors, drawControls, formats, select;
function init(){
map = new OpenLayers.Map('map');
//WMS地图图层
var wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",
"http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'});
//矢量图层,OpenLayers2.4的新功能,可以进行矢量编辑
vectors = new OpenLayers.Layer.Vector("Vector Layer");
//加入地图
map.addLayers([wms, vectors]);
map.addControl(new OpenLayers.Control.MousePosition());
map.addControl(new OpenLayers.Control.EditingToolbar(vectors));
//选项:hover的响应为真,鼠标移动的feature上响应为颜色的改变
//在选择事件中调用serialize方法,参数又库自动注入
var options = {
hover: true,
onSelect: serialize
};
select = new OpenLayers.Control.SelectFeature(vectors, options);
map.addControl(select);
select.activate();
//format下的两个子类声明
formats = {
wkt: new OpenLayers.Format.WKT(),
geojson: new OpenLayers.Format.GeoJSON()
};
map.setCenter(new OpenLayers.LonLat(0, 0), 1);
}
function serialize(feature) {
//从页面控件获得要生成的格式(WKT,GeoJSON)
var type = document.getElementById("formatType").value;
//调用Format父类的方法write,将feature转为WKT或GeoJSON
var str = formats[type].write(feature);
// 删去HTML字符便于显示(仅用于在页面显示)
str = str.replace(/,/g, ', ');
str = str.replace(/(<)/g, '<');
str = str.replace(/>/g, '> ');
document.getElementById('output').innerHTML = str;
}
function deserialize() {
//从页面元素中获得GeoJSON或WTK
var element = document.getElementById('text');
var type = document.getElementById("formatType").value;
//用Format父类的read方法读取GeoJSON或WTK生成features
var features = formats[type].read(element.value);
//边界,用于视图缩放
var bounds;
if(features) {
//假如只有一个feature也转为Array的形式
if(features.constructor != Array) {
features = [features];
}
for(var i=0; i<features.length; ++i) {
//第一次初始化边界
if (!bounds) {
bounds = features[i].geometry.getBounds();
} else {
//扩展边界
bounds.extend(features[i].geometry.getBounds());
}
}
//将新生成的feature加入vector图层
vectors.addFeatures(features);
map.zoomToExtent(bounds);
var plural = (features.length > 1) ? 's' : '';
element.value = features.length + ' feature' + plural + ' added'
} else {
element.value = 'Bad input ' + type;
}
}