openlayers/examples/example.html

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2   <head>
   3     <title>OpenLayers Example</title>
   4     <link rel="stylesheet" href="../theme/default/style.css" type="text/css" />
   5     <link rel="stylesheet" href="style.css" type="text/css" />
   6     <script src="../lib/OpenLayers.js"></script>
   7     <script type="text/javascript">
   8         // making this a global variable so that it is accessible for
   9         // debugging/inspecting in Firebug
  10         var map = null;
  11
  12         function init(){
  13
  14             map = new OpenLayers.Map('map');
  15
  16             var ol_wms = new OpenLayers.Layer.WMS(
  17                 "OpenLayers WMS",
  18                 "http://labs.metacarta.com/wms/vmap0",
  19                 {layers: 'basic'}
  20             );
  21
  22             var jpl_wms = new OpenLayers.Layer.WMS(
  23                 "NASA Global Mosaic",
  24                 "http://t1.hypercube.telascience.org/cgi-bin/landsat7",
  25                 {layers: "landsat7"}
  26             );
  27
  28             var dm_wms = new OpenLayers.Layer.WMS(
  29                 "DM Solutions Demo",
  30                 "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",
  31                 {
  32                     layers: "bathymetry,land_fn,park,drain_fn,drainage," +
  33                             "prov_bound,fedlimit,rail,road,popplace",
  34                     transparent: "true", format: "image/png"},
  35                 {
  36                     minResolution: 0.17578125,
  37                     maxResolution: 0.703125
  38                 }
  39             );
  40
  41             map.addLayers([ol_wms, jpl_wms, dm_wms]);
  42             map.addControl(new OpenLayers.Control.LayerSwitcher());
  43             map.zoomToMaxExtent();
  44         }
  45     </script>
  46   </head>
  47   <body onload="init()">
  48     <h1 id="title">OpenLayers Example</h1>
  49     <div id="tags"></div>
  50     <p id="shortdesc">
  51         Demonstrate a simple map with an overlay that includes layer switching controls.
  52     </p>
  53     <div id="map" class="smallmap"></div>
  54     <div id="docs"></div>
  55   </body>
  56 </html>