diff options
Diffstat (limited to 'misc/openlayers/examples/layerLoadMonitoring.html')
-rw-r--r-- | misc/openlayers/examples/layerLoadMonitoring.html | 135 |
1 files changed, 135 insertions, 0 deletions
diff --git a/misc/openlayers/examples/layerLoadMonitoring.html b/misc/openlayers/examples/layerLoadMonitoring.html new file mode 100644 index 0000000..f96d49c --- /dev/null +++ b/misc/openlayers/examples/layerLoadMonitoring.html @@ -0,0 +1,135 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> + <meta name="apple-mobile-web-app-capable" content="yes"> + <title>OpenLayers Layer Load Monitoring Example</title> + <link rel="stylesheet" href="../theme/default/style.css" type="text/css"> + <link rel="stylesheet" href="style.css" type="text/css"> + <style type="text/css"> + #controls { + float: left; + text-align: right; + } + #eventsLogID { + text-align: left; + width: 350px; + height: 475px; + overflow: auto; + border: 1px solid black; + } + </style> + <script src="../lib/Firebug/firebug.js"></script> + <script src="../lib/OpenLayers.js"></script> + <script type="text/javascript"> + var lon = 5; + var lat = 40; + var zoom = 5; + var map, layer; + + function init(){ + + eventsLog = OpenLayers.Util.getElement("eventsLogID"); + + map = new OpenLayers.Map( 'map' ); + map.addControl(new OpenLayers.Control.LayerSwitcher()); + + buffer0 = new OpenLayers.Layer.WMS( "WMS Buffer 0", + "http://vmap0.tiles.osgeo.org/wms/vmap0", + {layers: 'basic'} , + { singleTile: false, buffer:0} + ); + registerEvents(buffer0); + + buffer1 = new OpenLayers.Layer.WMS( "WMS Buffer 1", + "http://vmap0.tiles.osgeo.org/wms/vmap0", + {layers: 'basic'} , + { singleTile: false, buffer:1} + ); + registerEvents(buffer1); + + buffer2 = new OpenLayers.Layer.WMS( "WMS Buffer 2", + "http://vmap0.tiles.osgeo.org/wms/vmap0", + {layers: 'basic'} , + { singleTile: false, buffer:2 } + ); + registerEvents(buffer2); + + singleTileLayer = new OpenLayers.Layer.WMS( "Single Tile Layer", + "http://vmap0.tiles.osgeo.org/wms/vmap0", + {layers: 'basic'} , + { singleTile: true} + ); + registerEvents(singleTileLayer); + + map.setCenter(new OpenLayers.LonLat(lon, lat), zoom); + } + + function registerEvents(layer) { + + layer.logEvent = function(event) { + eventsLog.innerHTML += "<br>(" + getTimeStamp() + ") " + + this.name + ": " + event; + }; + + layer.events.register("loadstart", layer, function() { + this.logEvent("Load Start"); + }); + + layer.events.register("tileloaded", layer, function() { + this.logEvent("Tile loaded. " + this.numLoadingTiles + " left."); + }); + + layer.events.register("loadend", layer, function() { + this.logEvent("Load End. Grid:" + this.grid.length + "x" + this.grid[0].length); + }); + + map.addLayer(layer); + } + + + function getTimeStamp() { + var date = new Date(); + + var timeParts = [ + date.getHours(), + date.getMinutes(), + date.getSeconds() + ]; + + var timeStamp = timeParts.join(":"); + + return timeStamp; + } + + function clearLog() { + eventsLog.innerHTML = "<b>Events Log:</b>"; + } + </script> + </head> + <body onload="init()"> + <h1 id="title">Layer Load Monitoring Example</h1> + + <div id="tags"> + monitor, loading, light + </div> + + <p id="shortdesc"> + Demonstrate a method for monitoring tile loading performance. + </p> + + <div id="map" class="smallmap" style="float:left;"></div> + + <div id="controls"> + <div id="eventsLogID"> + <b>Events Log:</b> + </div> + + <input type="button" value="Clear" onclick="clearLog()"/> + </div> + + <div id="docs"> + </div> + </body> +</html> |