Sophie: openlayers-doc-2.12-2.fc18 noarch

openlayers-doc-2.12-2.fc18.noarch.rpm

<!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>