openlayers/tests/manual/ve-opacity.html

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2   <head>
   3     <style type="text/css">
   4         #map {
   5             width: 512px;
   6             height: 512px;
   7             border: 1px solid gray;
   8         }
   9     </style>
  10
  11     <script src='http://dev.virtualearth.net/mapcontrol/v3/mapcontrol.js'></script>
  12
  13     <script src="../../lib/OpenLayers.js"></script>
  14     <script type="text/javascript">
  15
  16         // make map available for easy debugging
  17         var map;
  18
  19         // avoid pink tiles
  20         OpenLayers.IMAGE_RELOAD_ATTEMPTS = 3;
  21         OpenLayers.Util.onImageLoadErrorColor = "transparent";
  22
  23         function init(){
  24             var options = {
  25                 projection: "EPSG:900913",
  26                 units: "m",
  27                 maxResolution: 156543.0339,
  28                 maxExtent: new OpenLayers.Bounds(-20037508, -20037508,
  29                                                  20037508, 20037508.34)
  30             };
  31             map = new OpenLayers.Map('map', options);
  32
  33             // create Virtual Earth layers
  34             var veroad = new OpenLayers.Layer.VirtualEarth(
  35                 "Virtual Earth Raods",
  36                 {'type': VEMapStyle.Road, 'sphericalMercator': true}
  37             );
  38
  39             // create WMS layer
  40             var wms = new OpenLayers.Layer.WMS(
  41                 "World Map",
  42                 "http://world.freemap.in/tiles/",
  43                 {'layers': 'factbook-overlay', 'format':'png'},
  44                 {
  45                     'opacity': 0.4,
  46                     'isBaseLayer': false,'wrapDateLine': true
  47                 }
  48             );
  49
  50             map.addLayers([veroad, wms]);
  51             map.zoomToMaxExtent()
  52         }
  53
  54
  55     </script>
  56   </head>
  57   <body onload="init()">
  58     <h3>VE Opacity</h3>
  59     <p>The overlay should have an opacity of 40%.</p>
  60     <div id="map"></div>
  61   </body>
  62 </html>