openlayers/examples/controls.html

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2     <head>
   3         <title>OpenLayers Map Controls Example</title>
   4
   5         <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
   6         <link rel="stylesheet" href="style.css" type="text/css" />
   7         <script src="../lib/OpenLayers.js"></script>
   8         <script type="text/javascript">
   9             var map;
  10             function init(){
  11                 map = new OpenLayers.Map('map', {
  12                     controls: [
  13                         new OpenLayers.Control.Navigation(),
  14                         new OpenLayers.Control.PanZoomBar(),
  15                         new OpenLayers.Control.LayerSwitcher({'ascending':false}),
  16                         new OpenLayers.Control.Permalink(),
  17                         new OpenLayers.Control.ScaleLine(),
  18                         new OpenLayers.Control.Permalink('permalink'),
  19                         new OpenLayers.Control.MousePosition(),
  20                         new OpenLayers.Control.OverviewMap(),
  21                         new OpenLayers.Control.KeyboardDefaults()
  22                     ],
  23                     numZoomLevels: 6
  24
  25                 });
  26
  27
  28                 var ol_wms = new OpenLayers.Layer.WMS( "OpenLayers WMS",
  29                     "http://labs.metacarta.com/wms/vmap0",
  30                     {layers: 'basic'} );
  31                 var jpl_wms = new OpenLayers.Layer.WMS( "NASA Global Mosaic",
  32                     "http://t1.hypercube.telascience.org/cgi-bin/landsat7",
  33                     {layers: "landsat7"});
  34                 var dm_wms = new OpenLayers.Layer.WMS( "DM Solutions Demo",
  35                     "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",
  36                     {layers: "bathymetry,land_fn,park,drain_fn,drainage," +
  37                              "prov_bound,fedlimit,rail,road,popplace",
  38                      transparent: "true", format: "image/png" });
  39
  40                 jpl_wms.setVisibility(false);
  41                 dm_wms.setVisibility(false);
  42
  43                 map.addLayers([ol_wms, jpl_wms, dm_wms]);
  44                 if (!map.getCenter()) map.zoomToMaxExtent();
  45             }
  46         </script>
  47     </head>
  48     <body onload="init()">
  49         <h1 id="title">Map Controls Example</h1>
  50
  51         <div id="tags">
  52         </div>
  53
  54         <p id="shortdesc">
  55             Attach zooming, panning, layer switcher, overview map, and permalink map controls to an OpenLayers window.
  56         </p>
  57
  58         <a style="float:right" href="" id="permalink">Permalink</a>
  59         <div id="map" class="smallmap"></div>
  60
  61         <div id="docs"></div>
  62     </body>
  63 </html>