diff options
Diffstat (limited to 'misc/openlayers/examples/getfeatureinfo-popup.html')
-rw-r--r-- | misc/openlayers/examples/getfeatureinfo-popup.html | 96 |
1 files changed, 96 insertions, 0 deletions
diff --git a/misc/openlayers/examples/getfeatureinfo-popup.html b/misc/openlayers/examples/getfeatureinfo-popup.html new file mode 100644 index 0000000..cecdebe --- /dev/null +++ b/misc/openlayers/examples/getfeatureinfo-popup.html @@ -0,0 +1,96 @@ +<!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>GetFeatureInfo Popup</title> + <script src="../lib/OpenLayers.js"></script> + <link rel="stylesheet" href="../theme/default/style.css" type="text/css"> + <link rel="stylesheet" href="style.css" type="text/css"> + <script> + OpenLayers.ProxyHost = "proxy.cgi?url="; + + var map, info; + + function load() { + map = new OpenLayers.Map({ + div: "map", + maxExtent: new OpenLayers.Bounds(143.834,-43.648,148.479,-39.573) + }); + + var political = new OpenLayers.Layer.WMS("State Boundaries", + "http://demo.opengeo.org/geoserver/wms", + {'layers': 'topp:tasmania_state_boundaries', transparent: true, format: 'image/gif'}, + {isBaseLayer: true} + ); + + var roads = new OpenLayers.Layer.WMS("Roads", + "http://demo.opengeo.org/geoserver/wms", + {'layers': 'topp:tasmania_roads', transparent: true, format: 'image/gif'}, + {isBaseLayer: false} + ); + + var cities = new OpenLayers.Layer.WMS("Cities", + "http://demo.opengeo.org/geoserver/wms", + {'layers': 'topp:tasmania_cities', transparent: true, format: 'image/gif'}, + {isBaseLayer: false} + ); + + var water = new OpenLayers.Layer.WMS("Bodies of Water", + "http://demo.opengeo.org/geoserver/wms", + {'layers': 'topp:tasmania_water_bodies', transparent: true, format: 'image/gif'}, + {isBaseLayer: false} + ); + + var highlight = new OpenLayers.Layer.Vector("Highlighted Features", { + displayInLayerSwitcher: false, + isBaseLayer: false + }); + + map.addLayers([political, roads, cities, water, highlight]); + + info = new OpenLayers.Control.WMSGetFeatureInfo({ + url: 'http://demo.opengeo.org/geoserver/wms', + title: 'Identify features by clicking', + queryVisible: true, + eventListeners: { + getfeatureinfo: function(event) { + map.addPopup(new OpenLayers.Popup.FramedCloud( + "chicken", + map.getLonLatFromPixel(event.xy), + null, + event.text, + null, + true + )); + } + } + }); + map.addControl(info); + info.activate(); + + map.addControl(new OpenLayers.Control.LayerSwitcher()); + map.zoomToMaxExtent(); + } + + </script> + </head> + <body onload="load()"> + <h1 id="title">Feature Info in Popup</h1> + + <div id="tags"> + WMS, GetFeatureInfo, popup + </div> + + <p id="shortdesc"> + Demonstrates the WMSGetFeatureInfo control for fetching information + about a position from WMS (via GetFeatureInfo request). Results + are displayed in a popup. + </p> + + <div id="map" class="smallmap"></div> + + <div id="docs"></div> + </body> +</html> |