ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Merge the excellent documentation work done during foss4g into trunk. Many

Browse Source 
thanks to all the contributors who helped put this together. 
I'm not exactly sure of what's going to happen with this, but for now,
at http://openlayers.org/dev/doc/examples.html you can see links to all the
examples *with descriptions*. Hooray!


git-svn-id: http://svn.openlayers.org/trunk/openlayers@5362 dc9f47b5-9b13-0410-9fdd-eb0c1a62fdaf
This commit is contained in:
crschmidt
2007-12-08 14:21:53 +00:00
parent ebf611c932
commit 7da6a3540e
90 changed files with 4188 additions and 1294 deletions
Download Patch File Download Diff File Expand all files Collapse all files

192
examples/draw-feature.html
View File

@@ -1,96 +1,108 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
#map {
width: 512px;
height: 350px;
border: 1px solid gray;
}
#controlToggle li {
list-style: none;
}
p {
width: 512px;
}
</style>
<script src="../lib/OpenLayers.js"></script>
<script type="text/javascript">
<!--
var map, drawControls;
OpenLayers.Util.onImageLoadErrorColor = "transparent";
function init(){
map = new OpenLayers.Map('map');
var wmsLayer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
"http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'});
var pointLayer = new OpenLayers.Layer.Vector("Point Layer");
var lineLayer = new OpenLayers.Layer.Vector("Line Layer");
var polygonLayer = new OpenLayers.Layer.Vector("Polygon Layer");
map.addLayers([wmsLayer, pointLayer, lineLayer, polygonLayer]);
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.addControl(new OpenLayers.Control.MousePosition());
var options = {handlerOptions: {freehand: true}};
drawControls = {
point: new OpenLayers.Control.DrawFeature(pointLayer,
OpenLayers.Handler.Point),
line: new OpenLayers.Control.DrawFeature(lineLayer,
OpenLayers.Handler.Path, options),
polygon: new OpenLayers.Control.DrawFeature(polygonLayer,
OpenLayers.Handler.Polygon, options)
};
for(var key in drawControls) {
map.addControl(drawControls[key]);
<head>
<title>Draw Feature Example</title>
<style type="text/css">
#map {
width: 512px;
height: 512px;
border: 1px solid gray;
}
map.setCenter(new OpenLayers.LonLat(0, 0), 3);
document.getElementById('noneToggle').checked = true;
}
#controlToggle li {
list-style: none;
}
p {
width: 512px;
}
</style>
<script src="../lib/OpenLayers.js"></script>
<script type="text/javascript">
<!--
var map, drawControls;
OpenLayers.Util.onImageLoadErrorColor = "transparent";
function init(){
map = new OpenLayers.Map('map');
function toggleControl(element) {
for(key in drawControls) {
var control = drawControls[key];
if(element.value == key && element.checked) {
control.activate();
} else {
control.deactivate();
var wmsLayer = new OpenLayers.Layer.WMS( "OpenLayers WMS",
"http://labs.metacarta.com/wms/vmap0?", {layers: 'basic'});
var pointLayer = new OpenLayers.Layer.Vector("Point Layer");
var lineLayer = new OpenLayers.Layer.Vector("Line Layer");
var polygonLayer = new OpenLayers.Layer.Vector("Polygon Layer");
map.addLayers([wmsLayer, pointLayer, lineLayer, polygonLayer]);
map.addControl(new OpenLayers.Control.LayerSwitcher());
map.addControl(new OpenLayers.Control.MousePosition());
var options = {handlerOptions: {freehand: true}};
drawControls = {
point: new OpenLayers.Control.DrawFeature(pointLayer,
OpenLayers.Handler.Point),
line: new OpenLayers.Control.DrawFeature(lineLayer,
OpenLayers.Handler.Path, options),
polygon: new OpenLayers.Control.DrawFeature(polygonLayer,
OpenLayers.Handler.Polygon, options)
};
for(var key in drawControls) {
map.addControl(drawControls[key]);
}
map.setCenter(new OpenLayers.LonLat(0, 0), 3);
document.getElementById('noneToggle').checked = true;
}
function toggleControl(element) {
for(key in drawControls) {
var control = drawControls[key];
if(element.value == key && element.checked) {
control.activate();
} else {
control.deactivate();
}
}
}
}
// -->
</script>
</head>
<body onload="init()">
<h1>OpenLayers Draw Feature Example</h1>
<div id="map"></div>
<ul id="controlToggle">
<li>
<input type="radio" name="type" value="none" id="noneToggle"
onclick="toggleControl(this);" checked="checked" />
<label for="noneToggle">navigate</label>
</li>
<li>
<input type="radio" name="type" value="point" id="pointToggle" onclick="toggleControl(this);" />
<label for="pointToggle">draw point</label>
</li>
<li>
<input type="radio" name="type" value="line" id="lineToggle" onclick="toggleControl(this);" />
<label for="lineToggle">draw line</label>
</li>
<li>
<input type="radio" name="type" value="polygon" id="polygonToggle" onclick="toggleControl(this);" />
<label for="polygonToggle">draw polygon</label>
</li>
</ul>
<p>Feature digitizing is in freehand mode by default. In freehand mode, the mouse is treated as a pen.
Drawing begins on mouse down, continues with every mouse move, and ends with mouse up.</p>
<p>To turn freehand mode off, hold down the shift key while digitizing. With freehand mode off, one
vertex is added with each click and double-clicks finish drawing. Freehand mode can be toggled on and off
at any time while drawing.</p>
</body>
// -->
</script>
</head>
<body onload="init()">
<h1 id="title">OpenLayers Draw Feature Example</h1>
<div id="tags"></div>
<p id="shortdesc">
Demonstrate on-screen digitizing tools for point, line, and polygon creation.
</p>
<div id="map"></div>
<ul id="controlToggle">
<li>
<input type="radio" name="type" value="none" id="noneToggle"
onclick="toggleControl(this);" checked="checked" />
<label for="noneToggle">navigate</label>
</li>
<li>
<input type="radio" name="type" value="point" id="pointToggle" onclick="toggleControl(this);" />
<label for="pointToggle">draw point</label>
</li>
<li>
<input type="radio" name="type" value="line" id="lineToggle" onclick="toggleControl(this);" />
<label for="lineToggle">draw line</label>
</li>
<li>
<input type="radio" name="type" value="polygon" id="polygonToggle" onclick="toggleControl(this);" />
<label for="polygonToggle">draw polygon</label>
</li>
</ul>
<div id="docs">
<p>Feature digitizing is in freehand mode by default. In freehand mode, the mouse is treated as a pen.
Drawing begins on mouse down, continues with every mouse move, and ends with mouse up.</p>
<p>To turn freehand mode off, hold down the shift key while digitizing. With freehand mode off, one
vertex is added with each click and double-clicks finish drawing. Freehand mode can be toggled on and off
at any time while drawing.</p>
</div>
</body>
</html>