openlayers/examples/wrapDateLine.html

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2   <head>
   3     <title>OpenLayers: Wrap Date Line</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         var map;
   9         function init(){
  10             map = new OpenLayers.Map( 'map', {maxResolution: 1.40625} );
  11             var mapserv = new OpenLayers.Layer.MapServer( "OpenLayers Basic",
  12                         "http://labs.metacarta.com/wms/vmap0",
  13                         {layers: 'basic'},
  14                         {wrapDateLine: true} );
  15
  16             var kamap = new OpenLayers.Layer.KaMap( "Blue Marble NG",
  17                         "http://www.openlayers.org/world/index.php",
  18                         {g: "satellite", map: "world"},
  19                         {wrapDateLine: true} );
  20
  21             var wms = new OpenLayers.Layer.WMS( "DM Solutions Demo",
  22                 "http://www2.dmsolutions.ca/cgi-bin/mswms_gmap",
  23                 {layers: "bathymetry,land_fn,park,drain_fn,drainage," +
  24                          "prov_bound,fedlimit,rail,road,popplace",
  25                  transparent: "true", format: "image/png"},
  26                 {wrapDateLine: true, reproject: false});
  27
  28             /* TMS is broken, too */
  29             tms = new OpenLayers.Layer.TMS( "OpenStreetMap",
  30                     "http://labs.metacarta.com/wms-c/Basic.py/",
  31                     {layername: 'osm-map', type:'png', wrapDateLine: true} );
  32
  33             /* WW doesn't quite work yet */
  34             ww = new OpenLayers.Layer.WorldWind( "LANDSAT",
  35                     "http://worldwind25.arc.nasa.gov/tile/tile.aspx", 2.25, 4,
  36                     {T:"105"},
  37                     {'maxResolution': .28125,
  38                      tileSize: new OpenLayers.Size(512, 512),
  39                      wrapDateLine: true});
  40
  41             map.addLayers([mapserv, kamap, wms]);
  42             map.addControl(new OpenLayers.Control.LayerSwitcher());
  43             map.addControl(new OpenLayers.Control.MousePosition());
  44             map.zoomToMaxExtent();
  45         }
  46     </script>
  47   </head>
  48   <body onload="init()">
  49     <h1 id="title">Wrapping the Date Line</h1>
  50     <div id="tags">
  51       Related to:
  52         <a href="http://dev.openlayers.org/docs/OpenLayers/Layer/WMS.html">Layer.WMS</a>,
  53         <a href="http://dev.openlayers.org/docs2/OpenLayers/Layer/MapServer.html">Layer.MapServer</a>,
  54         <a href="http://dev.openlayers.org/docs2/OpenLayers/Layer.html#wrapDateLine">wrapDateLine</a>
  55     </div>
  56
  57     <p id="shortdesc">Shows how to work around dateline issues, by wrapping the dateline on a number of layer types.</p>
  58     <div id="map" class="smallmap"></div>
  59     <div id="docs">
  60         <p>
  61         This is an example that shows wrapping the date line. Wrapping the
  62         date line is an option on the layer.
  63         </p>
  64         <p>
  65           You can do it with a 'Layer.WMS' or a 'Layer.MapServer' layer.
  66         </p>
  67     <pre id="code">
  68     var mapserv = new OpenLayers.Layer.MapServer( "OpenLayers Basic",
  69                 "http://labs.metacarta.com/wms/vmap0",
  70                 {layers: 'basic'},
  71                 <b>{wrapDateLine: true}</b> );
  72     </pre>
  73     </div>
  74   </body>
  75 </html>