--- step-2/index.html 2023-07-02 13:20:09.119154723 +0000 +++ step-3/index.html 2023-07-02 13:20:09.119154723 +0000 @@ -1,6 +1,6 @@ <html> <head> - <title>Step 2: setting initial position</title> + <title>Step 3: adding map controls</title> <script src="../OpenLayers.js"></script> <script src="../OpenStreetMap.js"></script> <script> @@ -12,7 +12,15 @@ projLonLat = new OpenLayers.Projection("EPSG:4326"); // WGS 1984 projMercator = new OpenLayers.Projection("EPSG:900913"); // Spherical Mercator - map = new OpenLayers.Map("demoMap"); + map = new OpenLayers.Map("demoMap", + { controls: [ new OpenLayers.Control.Navigation(), // direct panning via mouse drag + new OpenLayers.Control.Attribution(), // attribution text + new OpenLayers.Control.PanZoomBar(), // larger navigation control + new OpenLayers.Control.MousePosition({'displayProjection': projMercator}) // mouse position + new OpenLayers.Control.OverviewMap() // overview map + ] + } + ); map.addLayer(new OpenLayers.Layer.OSM.Mapnik()); map.setCenter(new OpenLayers.LonLat(lon, lat).transform(projLonLat,projMercator), zoom); }