OpenLayers OpenLayers

Changeset 4593

Show
Ignore:
Timestamp:
09/28/07 18:13:09 (1 year ago)
Author:
dzwarg
Message:

Added doc ids: tags, title, shortdesc, and docs. Added Percy's documentation.

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved
  • sandbox/docs/examples/layerLoadMonitoring.html

    r4286 r4593  
    11<html xmlns="http://www.w3.org/1999/xhtml"> 
    22  <head> 
     3    <title>OpenLayers Layer Load Monitoring Example</title> 
    34    <style type="text/css"> 
    45        #map { 
    5             position: absolute; 
    6             top: 5px; 
    7             left: 5px; 
    8             width: 450px; 
    9             height: 475px; 
     6            width: 512px; 
     7            height: 512px; 
    108            border: 1px solid black; 
    119        } 
     10        #controls { 
     11            float: left; 
     12            text-align: right; 
     13        } 
    1214        #eventsLogID { 
    13             position: absolute; 
    14             top: 5px; 
    15             left: 460px; 
     15            text-align: left; 
    1616            width: 350px; 
    1717            height: 475px; 
     
    2727        var zoom = 5; 
    2828        var map, layer; 
    29          
     29 
    3030        function init(){ 
    3131 
     
    3434            map = new OpenLayers.Map( 'map' ); 
    3535            map.addControl(new OpenLayers.Control.LayerSwitcher()); 
    36             
    37             buffer0 = new OpenLayers.Layer.WMS( "WMS Buffer 0",  
     36 
     37            buffer0 = new OpenLayers.Layer.WMS( "WMS Buffer 0", 
    3838                    "http://labs.metacarta.com/wms/vmap0", 
    39                     {layers: 'basic'} ,  
     39                    {layers: 'basic'} , 
    4040                    { singleTile: false, buffer:0} 
    4141            ); 
    4242            registerEvents(buffer0); 
    4343 
    44             buffer1 = new OpenLayers.Layer.WMS( "WMS Buffer 1",  
     44            buffer1 = new OpenLayers.Layer.WMS( "WMS Buffer 1", 
    4545                    "http://labs.metacarta.com/wms/vmap0", 
    46                     {layers: 'basic'} ,  
     46                    {layers: 'basic'} , 
    4747                    { singleTile: false, buffer:1} 
    4848            ); 
    4949            registerEvents(buffer1); 
    5050 
    51             buffer2 = new OpenLayers.Layer.WMS( "WMS Buffer 2",  
     51            buffer2 = new OpenLayers.Layer.WMS( "WMS Buffer 2", 
    5252                    "http://labs.metacarta.com/wms/vmap0", 
    53                     {layers: 'basic'} ,  
     53                    {layers: 'basic'} , 
    5454                    { singleTile: false, buffer:2 } 
    5555            ); 
    5656            registerEvents(buffer2); 
    5757 
    58             singleTileLayer = new OpenLayers.Layer.WMS( "Single Tile Layer",  
     58            singleTileLayer = new OpenLayers.Layer.WMS( "Single Tile Layer", 
    5959                    "http://labs.metacarta.com/wms/vmap0", 
    60                     {layers: 'basic'} ,  
     60                    {layers: 'basic'} , 
    6161                    { singleTile: true} 
    6262            ); 
    6363            registerEvents(singleTileLayer); 
    64              
     64 
    6565            map.setCenter(new OpenLayers.LonLat(lon, lat), zoom); 
    66         }         
    67          
     66        } 
     67 
    6868        function registerEvents(layer) { 
    69                  
     69 
    7070            layer.logEvent = function(event) { 
    7171                eventsLog.innerHTML += "<br>(" + getTimeStamp() + ") " + 
    72                                        this.name + ": " + event;     
     72                                       this.name + ": " + event; 
    7373            } 
    74              
     74 
    7575            layer.events.register("loadstart", layer, function() { 
    7676                this.logEvent("Load Start"); 
    7777            }); 
    78       
     78 
    7979            layer.events.register("tileloaded", layer, function() { 
    8080                this.logEvent("Tile loaded. " + this.numLoadingTiles + " left."); 
    8181            }); 
    82              
     82 
    8383            layer.events.register("loadend", layer, function() { 
    8484                this.logEvent("Load End. Grid:" + this.grid.length + "x" + this.grid[0].length); 
    8585            }); 
    86              
     86 
    8787            map.addLayer(layer); 
    8888        } 
    8989 
    90          
     90 
    9191        function getTimeStamp() { 
    9292            var date = new Date(); 
    93              
     93 
    9494            var timeParts = [ 
    95                 date.getHours(),  
    96                 date.getMinutes(),  
     95                date.getHours(), 
     96                date.getMinutes(), 
    9797                date.getSeconds() 
    9898            ]; 
    99              
     99 
    100100            var timeStamp = timeParts.join(":"); 
    101              
     101 
    102102            return timeStamp; 
    103103        } 
     
    109109  </head> 
    110110  <body onload="init()"> 
    111     <div id="map"></div> 
    112     <div id="controls"> 
     111    <h1 id="title">Layer Load Monitoring Example</h1> 
     112 
     113    <div id="tags"></div> 
     114 
     115    <p id="shortdesc"> 
     116        Demonstrate a method for monitoring tile loading performance. 
     117    </p> 
     118 
     119    <div id="map" style="float:left;"></div> 
     120 
     121    <div id="controls"> 
    113122        <div id="eventsLogID"> 
    114123            <b>Events Log:</b> 
    115         </div>          
     124        </div> 
     125 
     126        <input type="button" value="Clear" onclick="clearLog()"/> 
    116127    </div> 
    117     <div style="position:absolute; top: 500px; width: 700px"> 
    118         <input type="button" value="Clear" style="float:right" onclick="clearLog()"/
     128 
     129    <div id="docs"
    119130    </div> 
    120131  </body>