diff options
Diffstat (limited to 'misc/openlayers/tests/manual/multiple-google-layers.html')
| -rw-r--r-- | misc/openlayers/tests/manual/multiple-google-layers.html | 135 |
1 files changed, 135 insertions, 0 deletions
diff --git a/misc/openlayers/tests/manual/multiple-google-layers.html b/misc/openlayers/tests/manual/multiple-google-layers.html new file mode 100644 index 0000000..df5c4f0 --- /dev/null +++ b/misc/openlayers/tests/manual/multiple-google-layers.html @@ -0,0 +1,135 @@ +<html> + <head> + <title>Multiple Google Layers Acceptance Test</title> + <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhR_wWLPFku8Ix9i2SXYRVK3e45q1BQUd_beF8dtzKET_EteAjPdGDwqpQ"></script> + <script src="../../lib/OpenLayers.js"></script> + <link rel="stylesheet" href="../../theme/default/style.css" type="text/css" /> + <link rel="stylesheet" href="../../theme/default/google.css" type="text/css" /> + <style> + .col { + position: relative; + width: 50%; + } + #col1 { + float: left; + } + #col2 { + float: right; + } + .map { + position: relative; + height: 300px; + } + .wrap { + position: relative; + padding: 10px; + } + ul { + padding: 0; + } + ul li { + list-style: none; + } + p.clear { + clear: both; + } + </style> + </head> + <body> + <div id="col1" class="col"> + <div class="wrap"> + <div id="map1" class="map"></div> + layers for map1 + <ul> + <li><input type="checkbox" checked="checked" name="streets1" id="streets1"><label for="streets1">streets</label></li> + <li><input type="checkbox" checked="checked" name="sat1" id="sat1"><label for="sat1">imagery</label></li> + <li><input type="checkbox" checked="checked" name="topo1" id="topo1"><label for="topo1">topography</label></li> + </ul> + </div> + </div> + <div id="col2" class="col"> + <div class="wrap"> + <div id="map2" class="map"></div> + layers for map2 + <ul> + <li><input type="checkbox" name="streets2" id="streets2"><label for="streets2">streets</label></li> + <li><input type="checkbox" name="sat2" id="sat2"><label for="sat2">imagery</label></li> + <li><input type="checkbox" name="topo2" id="topo2"><label for="topo2">topography</label></li> + </ul> + </div> + </div> + <p class="clear"> + This example is used to confirm that resizable maps with multiple + Google layers work properly. Click the checkboxes to add/remove + layers from the maps. Use the layer switcher to change the map's + base layer. You should be able to confirm the following: + <ol> + <li>Adding and removing layers doesn't raise any errors + (regardless of how many times the same layer is added/removed).</li> + <li>The Google "Powered By" link is always visible and clickable + when a Google layer is displayed.</li> + <li>The Google "Terms of Use" link is always visible and clickable + when a Google layer is displayed.</li> + <li>Resizing a map (by resizing the browser window) and then + changing base layer works well. That is, the center & scale are + preserved and all tiles are well aligned.</li> + <li>Setting the base layer to the "Dummy Layer" hides all other + Google base layers, "Powered By" link, and "Terms of Use" link.</li> + </ol> + </p> + <script> + + var map1 = new OpenLayers.Map("map1"); + var streets1 = new OpenLayers.Layer.Google("Streets", { + type: G_NORMAL_MAP + }); + var sat1 = new OpenLayers.Layer.Google("Imagery", { + type: G_SATELLITE_MAP + }); + var topo1 = new OpenLayers.Layer.Google("Topography", { + type: G_PHYSICAL_MAP + }); + var dummy1 = new OpenLayers.Layer("Dummy Layer", { + isBaseLayer: true + }); + map1.addLayers([streets1, sat1, topo1, dummy1]); + map1.addControl(new OpenLayers.Control.LayerSwitcher); + map1.zoomToMaxExtent(); + + var map2 = new OpenLayers.Map("map2"); + var streets2 = new OpenLayers.Layer.Google("Streets", { + type: G_NORMAL_MAP + }); + var sat2 = new OpenLayers.Layer.Google("Imagery", { + type: G_SATELLITE_MAP + }); + var topo2 = new OpenLayers.Layer.Google("Topography", { + type: G_PHYSICAL_MAP + }); + var dummy2 = new OpenLayers.Layer("Dummy Layer", { + isBaseLayer: true + }); + map2.addLayer(dummy2); + map2.addControl(new OpenLayers.Control.LayerSwitcher); + map2.zoomToMaxExtent(); + + // add behavior to checkboxes + var check, inputs = document.getElementsByTagName("input"); + for (var i=0, len=inputs.length; i<len; ++i) { + check = inputs[i]; + check.onclick = function() { + var name = this.name; + var num = name.match(/\d$/)[0]; + var layer = window[name]; + var map = window["map" + num]; + if (this.checked) { + map.addLayer(layer); + } else { + map.removeLayer(layer); + } + } + } + + </script> + </body> +</html>
\ No newline at end of file |