Files
openlayers/examples/wps.html
2012-03-30 19:57:20 -07:00

87 lines
3.1 KiB
HTML

<!DOCTYPE html>
<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>OpenLayers WPS Builder Example</title>
<link rel="stylesheet" href="../theme/default/style.css" type="text/css">
<link rel="stylesheet" href="style.css" type="text/css">
<style type="text/css">
.olControlEditingToolbar .olControlModifyFeatureItemInactive {
background-image: url(../theme/default/img/draw_point_off.png);
}
.olControlEditingToolbar .olControlModifyFeatureItemActive {
background-image: url(../theme/default/img/draw_point_on.png);
}
textarea {
display: block;
width: 100%;
height: 3em;
}
label {
display: block;
}
.notsupported {
color: red;
}
button {
display: block;
margin-top: 10px;
}
#docs {
top: 6em;
left: 550px;
position: absolute;
margin-right: 10px;
}
</style>
</head>
<body>
<h1 id="title">WPS Builder Example</h1>
<div id="tags">
wps, process
</div>
<div id="shortdesc">Using WPS formats to interact with WPS</div>
<div id="docs">
<p>This example shows WPS in action by using the WPSCapabilities,
WPSDescribeProcess and WPSExecute formats. See
<a target="_blank" href="bing-tiles.js">wps.js</a> for the
source code.</p>
<ol>
<li>Select a process from the list below. The list is populated
with the result of a WPS GetCapabilities request, parsed using
<code>OpenLayers.Format.WPSCapabilities::read</code>.</li>
<li>Fill out the Input form. Hover over fields to get a description.
To use a geometry from the map as input, select the geometry on the
map (using the pen symbol on the left of the toolbar) and just
click the field. The form is generated from the object returned by
<code>OpenLayers.Format.WPSDescribeProcess::read</code></li>
<li>Click "Execute" and examine the result in the result text area.
If the result can be parsed as features, it will be displayed on
the map as well. The process data is sent to the server with the
serialized XML from <code>OpenLayers.Format.WPSExecute::write</code>,
which can use a modified
<code>OpenLayers.Format.WPSDescribeProcess</code> result object as
input.</li>
</ol>
</div>
<div id="example" style="width:520px">
<div id="map" class="smallmap"></div>
<div>
<select id="processes"><option>Select a process</option></select>
<p id="abstract"></p>
<div id="input"></div>
<div id="output"></div>
</div>
</div>
<script src="../lib/OpenLayers.js"></script>
<script src="wps.js"></script>
</body>
</html>