openlayers/tests/manual/reflow.html

   1 <html xmlns="http://www.w3.org/1999/xhtml">
   2   <head>
   3     <style type="text/css">
   4         #map {
   5             width: 800px;
   6             height: 475px;
   7             border: 1px solid black;
   8         }
   9     </style>
  10     <script src="../../lib/OpenLayers.js" type="text/javascript"></script>
  11     <script type="text/javascript">
  12
  13         var map;
  14         var vectors;
  15
  16         function init(){
  17             map = new OpenLayers.Map('map');
  18             var wms = new OpenLayers.Layer.WMS(
  19                 "OpenLayers WMS",
  20                 "http://labs.metacarta.com/wms/vmap0",
  21                 {layers: 'basic'}
  22             );
  23
  24             vectors = new OpenLayers.Layer.Vector(
  25                 "Simple Geometry",
  26                 {
  27                     styleMap: new OpenLayers.StyleMap({
  28                         externalGraphic: "../../img/marker-gold.png",
  29                         pointRadius: 10
  30                     })
  31                 }
  32             );
  33
  34             map.addLayers([wms, vectors]);
  35
  36             var features = [];
  37             var x = -111.04;
  38             var y = 45.68;
  39             for(var i = 0; i < 10; i++){
  40                 x += i * .5;
  41                 y += i * .1;
  42                 features.push(
  43                     new OpenLayers.Feature.Vector(
  44                         new OpenLayers.Geometry.Point(x, y)
  45                     )
  46                 );
  47             }
  48
  49             map.setCenter(new OpenLayers.LonLat(x, y), 5);
  50             vectors.addFeatures(features);
  51         };
  52
  53     </script>
  54   </head>
  55   <body onload="init()">
  56     <div id="map"></div>
  57     <p>Use the pan buttons.  See flicker at end of animated pan.</p>
  58   </body>
  59 </html>