diff options
Diffstat (limited to 'misc/openlayers/examples/SLDSelect.html')
| -rw-r--r-- | misc/openlayers/examples/SLDSelect.html | 202 |
1 files changed, 0 insertions, 202 deletions
diff --git a/misc/openlayers/examples/SLDSelect.html b/misc/openlayers/examples/SLDSelect.html deleted file mode 100644 index ff07e31..0000000 --- a/misc/openlayers/examples/SLDSelect.html +++ /dev/null @@ -1,202 +0,0 @@ -<!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 SLD based selection control</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"> - .olControlSLDSelectBoxActive { - cursor: crosshair; - } - .olControlSLDSelectPolygonActive { - cursor: crosshair; - } - .olControlSLDSelectLineActive { - cursor: crosshair; - } - .olControlSLDSelectPointActive { - cursor: pointer; - } - </style> - <script src="../lib/OpenLayers.js"></script> - <script type="text/javascript"> - var map, controls, layers; - - function init(){ - OpenLayers.ProxyHost= "proxy.cgi?url="; - map = new OpenLayers.Map('map', {allOverlays: true, controls: []}); - var url = "http://demo.opengeo.org/geoserver/wms"; - layers = { - states: new OpenLayers.Layer.WMS("State boundary", url, - {layers: 'topp:tasmania_state_boundaries', format: 'image/gif', transparent: 'TRUE'}, - {singleTile: true}), - roads: new OpenLayers.Layer.WMS("Roads", url, - {layers: 'topp:tasmania_roads', format: 'image/gif', transparent: 'TRUE'}, - {singleTile: true}), - waterbodies: new OpenLayers.Layer.WMS("Water bodies", url, - {layers: 'topp:tasmania_water_bodies', format: 'image/gif', transparent: 'TRUE'}, - {singleTile: true}), - cities: new OpenLayers.Layer.WMS("Cities", url, - {layers: 'topp:tasmania_cities', format: 'image/gif', transparent: 'TRUE'}, - {singleTile: true}) - }; - - for (var key in layers) { - map.addLayer(layers[key]); - } - - map.setCenter(new OpenLayers.LonLat(146.65748632815,-42.230763671875), 7); - - map.addControl(new OpenLayers.Control.LayerSwitcher()); - - controls = { - navigation: new OpenLayers.Control.Navigation(), - box: new OpenLayers.Control.SLDSelect( - OpenLayers.Handler.RegularPolygon, - { - displayClass: 'olControlSLDSelectBox', - layers: [layers['waterbodies']], - handlerOptions: {irregular: true} - } - ), - polygon: new OpenLayers.Control.SLDSelect( - OpenLayers.Handler.Polygon, - { - displayClass: 'olControlSLDSelectPolygon', - layers: [layers['waterbodies']] - } - ), - line: new OpenLayers.Control.SLDSelect( - OpenLayers.Handler.Path, - { - displayClass: 'olControlSLDSelectLine', - layers: [layers['waterbodies']] - } - ), - point: new OpenLayers.Control.SLDSelect( - OpenLayers.Handler.Click, - { - displayClass: 'olControlSLDSelectPoint', - layers: [layers['waterbodies']] - } - ), - circle: new OpenLayers.Control.SLDSelect( - OpenLayers.Handler.RegularPolygon, - { - displayClass: 'olControlSLDSelectBox', - layers: [layers['waterbodies']], - handlerOptions: {sides: 30} - } - ) - }; - - for(var key in controls) { - map.addControl(controls[key]); - } - } - - function toggleControl(element) { - for(var key in controls) { - var control = controls[key]; - if(element.value == key && element.checked) { - control.activate(); - } else { - control.deactivate(); - } - } - } - - function toggleSelectionLayer(element) { - var selectLayers = []; - var elements = element.value.split("_"); - for (var key in layers) { - var layer = layers[key]; - for (var i=0, len=elements.length; i<len; i++) { - var value = elements[i]; - if (value == key && element.checked) { - selectLayers.push(layer); - } - } - } - for (var i=0, len=this.map.controls.length; i<len; i++) { - var control = this.map.controls[i]; - if (control instanceof OpenLayers.Control.SLDSelect) { - control.setLayers(selectLayers); - } - } - } - - </script> - </head> - <body onload="init()"> - <h1 id="title">SLD based selection on WMS layers</h1> - - <div id="tags"> - sld, sldselect, styling, style - </div> - - <div id="shortdesc">Using Styled Layer Descriptors to make a selection on WMS layers</div> - - <div id="map" style="width: 512px; height: 256px; border: 1px solid red;"></div> - - <div id="docs"> - This example uses the OpenLayers.Control.SLDSelect to select features in a WMS - layer. The features are highlighted using Styled Layer Descriptors (SLD). The - control supports point, box, line and polygon selection modes by configuring the - appriopriate handler. - </div> - - <div id="controls"> - <ul id="controlToggle"><b>Map Controls</b> - <li> - <input type="radio" name="control" value="navigation" id="noneToggle" onclick="toggleControl(this);" CHECKED> - <label for="noneToggle">navigate</label> - </li> - <li> - <input type="radio" name="control" value="box" id="boxToggle" onclick="toggleControl(this);"> - <label for="boxToggle">SLD select with box</label> - </li> - <li> - <input type="radio" name="control" value="polygon" id="polygonToggle" onclick="toggleControl(this);"> - <label for="polygonToggle">SLD select with polygon</label> - </li> - <li> - <input type="radio" name="control" value="line" id="lineToggle" onclick="toggleControl(this);"> - <label for="lineToggle">SLD select with line</label> - </li> - <li> - <input type="radio" name="control" value="point" id="pointToggle" onclick="toggleControl(this);"> - <label for="pointToggle">SLD select with point</label> - </li> - <li> - <input type="radio" name="control" value="circle" id="circleToggle" onclick="toggleControl(this);"> - <label for="circleToggle">SLD select with circle</label> - </li> - </ul> - </div> - <div id="layers"> - <ul id="layerToggle"><b>Selection layer</b> - <li> - <input type="radio" name="layer" value="waterbodies" id="waterbodiesToggle" onclick="toggleSelectionLayer(this);" CHECKED> - <label for="noneToggle">Water bodies</label> - </li> - <li> - <input type="radio" name="layer" value="cities" id="citiesToggle" onclick="toggleSelectionLayer(this);"> - <label for="citiesToggle">Cities</label> - </li> - <li> - <input type="radio" name="layer" value="roads" id="roadsToggle" onclick="toggleSelectionLayer(this);"> - <label for="roadsToggle">Roads</label> - </li> - <li> - <input type="radio" name="layer" value="roads_cities" id="roadsCitiesToggle" onclick="toggleSelectionLayer(this);"> - <label for="roadsCitiesToggle">Roads and cities</label> - </li> - </ul> - </div> - - </body> -</html> |