====== CREAR SENCILLO MAPA USANDO OPENLAYERS EN 5 PASOS ====== ===== Paso 1 ===== Debes de agregar en el encabezado de tu página html la referencia a la librería de OpenLayers con la siguiente instrucción: ===== Paso 2 ===== Agrega un elemento div dentro de la sección body de tu página html y asignale un id:
===== Paso 3 ===== Comienza una sección de código de javascript y dentro de él crea un objeto map de OpenLayers asociado a tu elemento div que definiste en el paso 2 var map = new OpenLayers.Map("mapa"); Otra opción con más detalle en la que se detalla el rectángulo del mapa. var map = new OpenLayers.Map('map',{maxExtent: new OpenLayers.Bounds(287270.3309, 1065338.4815, 295472.9419, 1071486.7036), maxResolution: 'auto', projection:"EPSG:24719", units: "m"}); ===== Paso 4 ===== Crea Los Layers que vas a agregar a tu visor. En este ejemplo se tienen dos layers, uno es el que MetaCarta ofrece para pruebas de OpenLayer y el segundo hace referencia al servicio de ortofotos del INEGI. Y por supuesto agregalos a tu mapa que creaste. var ol_wms = new OpenLayers.Layer.WMS( "World", "http://labs.metacarta.com/wms-c/Basic.py?", {layers: 'basic', visibility: false}); var wmsinegi = new OpenLayers.Layer.WMS("Ortofotos de INEGI", "http://antares.inegi.gob.mx/cgi-bin/map4/mapserv_orto", {layers: "orto20k,orto3m", transparent:"true",format: "image/png"}); map.addLayers([ol_wms, wmsinegi]); ===== Paso 5 ===== Después de eso solo es necesario darle su “manita de gato” al visor. En el ejemplo se centró el mapa en la Ciudad de México y se agregaron los controles para encender y apagar los layers y el que indica la posición del cursor: var CdMexLatLon = new OpenLayers.LonLat(-99.147,19.41); map.setCenter(CdMexLatLon, 13); map.addControl(new OpenLayers.Control.LayerSwitcher()); map.addControl(new OpenLayers.Control.MousePosition()); mas información en :[[http://www.bostongis.com/TutBook.aspx#54]]