openlayers/tests/manual/overviewmap-projection.html

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2   <head>
   3     <link rel="stylesheet" href="../../theme/default/style.css" type="text/css" />
   4     <link rel="stylesheet" href="../../examples/style.css" type="text/css" />
   5     <style type="text/css">
   6         .olControlAttribution { bottom: 0px!important }
   7         #map {
   8             height: 512px;
   9         }
  10     </style>
  11
  12     <script src='http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ'></script>
  13
  14     <script src="../../lib/OpenLayers.js"></script>
  15     <script type="text/javascript">
  16
  17         // make map available for easy debugging
  18         var map;
  19
  20         function init(){
  21             var options = {
  22                 projection: new OpenLayers.Projection("EPSG:900913"),
  23                 displayProjection: new OpenLayers.Projection("EPSG:4326"),
  24                 units: "m",
  25                 maxResolution: 156543.0339,
  26                 maxExtent: new OpenLayers.Bounds(-20037508, -20037508,
  27                                                  20037508, 20037508.34)
  28             };
  29             map = new OpenLayers.Map('map', options);
  30
  31             // create Google Mercator layers
  32             var gmap = new OpenLayers.Layer.Google(
  33                 "Google Streets",
  34                 {'sphericalMercator': true}
  35             );
  36             map.addLayers([gmap]);
  37             map.addControl(new OpenLayers.Control.LayerSwitcher());
  38             map.addControl(new OpenLayers.Control.Permalink());
  39             map.addControl(new OpenLayers.Control.MousePosition());
  40             var ovmap = new OpenLayers.Control.OverviewMap({
  41                 maxRatio: 16,
  42                 layers: [new OpenLayers.Layer.WMS("OpenLayers WMS",
  43                     "http://labs.metacarta.com/wms/vmap0",
  44                     {layers: 'basic'})]
  45             });
  46             map.addControl(ovmap);
  47             ovmap.maximizeControl();
  48             if (!map.getCenter()) {map.zoomToMaxExtent()};
  49         }
  50     </script>
  51   </head>
  52   <body onload="init()">
  53     <h1 id="title">OpenLayers Overview Map Projection Test</h1>
  54
  55     <div id="tags">
  56     </div>
  57     <p id="shortdesc">
  58         Acceptance test for different projections in map and overview map.
  59         The map uses EPSG:900913, the overview map EPSG:4326. Zoom the map and
  60         drag both the map and the overview map to see it in action.
  61     </p>
  62     <div id="map" class="smallmap"></div>
  63
  64     <div id="docs">
  65     </div>
  66   </body>
  67 </html>
  68
  69
  70