I have created a mapping application using the excellent examples provided in www.openlayers.org, any ideas on how I can improve on it (cosmetic effects), what I would want to do is: 1. emulate the smoothness of google maps as one pans and zooms (I know this is done using caching - how do I define this in the code 2. change mouse pointer (to a hand when using the zoom in/out slider and have tooltips 3. assistance with the overview windows as it is not consistence as one zooms in/out, i.e the size of the area as indicated by the red dotted rectangle (would like it to be consistence)
The suggestions from the community I could consolidate into a small howto. Here is the code: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style type="text/css"> #map { width: 60%; height: 400px; border: 1px solid black; } </style> <!-- this gmaps key generated for http://openlayers.org/dev/ --> <script src=' http://maps.google.com/maps?file=api&v=2&key=ABQIAAAA9XNhd8q0UdwNC7YSO4YZghSPUCi5aRYVveCcVYxzezM4iaj_gxQ9t-UajFL70jfcpquH5l1IJ-Zyyw' ></script> <!-- Localhost key --> <!-- <script src=' http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAjpkAC9ePGem0lIq5XcMiuhT2yXp_ZAY8_ufC3CFXhHIE1NvwkxTS6gjckBmeABOGXIUiOiZObZESPg' ></script>--> <!--script type="text/javascript" src=" http://clients.multimap.com/API/maps/1.1/metacarta_04"></script> <script src='http://dev.virtualearth.net/mapcontrol/v3/mapcontrol.js' ></script> <script src=" http://api.maps.yahoo.com/ajaxymap?v=3.0&appid=euzuro-openlayers "></script--> <script src="http://openlayers.org/api/OpenLayers.js"></script> <script type="text/javascript"> //var lon = 27.77344; //var lat = -32.98448; var lon = 27.92725; var lat = -33.00866; var zoom = 5; var map, markers; var eastlondon = new OpenLayers.LonLat(27.92725, -33.00866); var bhisho = new OpenLayers.LonLat(27.43286, -32.85190); function init(){ //setup of the openlayer map area //map = new OpenLayers.Map( $('map'), {controls:[]}); map = new OpenLayers.Map( $('map'), {controls:[], numZoomLevels: 19, minZoomLevel: 5, maxZoomLevel: 19}); map.addControl(new OpenLayers.Control.PanZoomBar ({div:$('zoomControl')})); map.addControl(new OpenLayers.Control.LayerSwitcher ({'ascending':true})); map.addControl(new OpenLayers.Control.MouseDefaults()); map.addControl( new OpenLayers.Control.MousePosition()); //load layers into the map area var wms = new OpenLayers.Layer.WMS( "OpenLayers WMS", "http://labs.metacarta.com/wms/vmap0", {layers: 'basic'} ); var google = new OpenLayers.Layer.Google( "Google Map" , {type: G_NORMAL_MAP}); var googles = new OpenLayers.Layer.Google( "Google Satellite" , {type: G_SATELLITE_MAP }); var googleh = new OpenLayers.Layer.Google( "Google Hybrid" , {type: G_HYBRID_MAP }); //zoom to area around bufallocity eastern cape south africa map.addLayers([google, googles, googleh,wms]); map.setCenter(new OpenLayers.LonLat(lon, lat), zoom); var options = { layers: [wms.clone()], minRatio: 20, maxRatio: 128 }; //create an overview area var overview = new OpenLayers.Control.OverviewMap(options); map.addControl(overview); map.setCenter(eastlondon, zoom); overview.maximizeControl(); }; </script> </head> <body onload="init()"> <h1><bold>---------</bold></h1> <div id="map", centre></div> </body> </html> -- Sindile Bidla Intengu Technologies
_______________________________________________ Users mailing list [email protected] http://openlayers.org/mailman/listinfo/users
