Bienvenidos a Nuestro Mundo - A Proyectos Beta!

En nuestra vida, desde que nacemos todo lo probamos, ensayamos y testeamos; así también erramos, caemos pero por sobre todo aprendemos. Es decir, todo lo que hacemos forma parte de una nueva experiencia, de un PROYECTO. El que siempre exista la posibilidad de mejorarlo es lo que lo convierte en BETA. En este blog queremos compartir contenidos de tipo informático con artículos de programación, software libre y propietario, redes, base de datos, noticias, experiencias, etc... y también de humor. Es un sitio de todos y para todos. Participá! Sos importante ...

Colocar varios marcadores en OpenLayers


Imagen de un ejemplo de varios marcadores en OpenLayers usando OpenStreetMap
Colocar varios marcadores en OpenLayers es muy sencillo.
Abajo coloco lo que se necesita con su correspondiente comentario para colocar un marcador en el mapa. 

// Se instancia el layer Markers. 
layer_marcador = new OpenLayers.Layer.Markers( "Marcador" ); 

// Agregar el layer marcador al mapa. 
mapa.addLayer(layer_marcador); 

tamanio = new OpenLayers.Size(21, 25); 
offset = new OpenLayers.Pixel(-(tamanio.w / 2), -tamanio.h); 

// Icono del marcador. 
icono = new OpenLayers.Icon('../libs/OpenLayers-2.11/img/marker.png', tamanio, offset); 

// Se agrega un marcador en el Layer de marcadores. 
layer_marcador.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(-57.58462,       -25.31699).transform(
    fromProjection,                     // Transformar from WGS 1984 
    toProjection                        // a Spherical Mercator Projection. 
), icono)); 

// Se agrega otro marcador en el Layer de marcadores.
layer_marcador.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(-57.56408, -25.31596).transform(
    fromProjection,                     // Transformar from WGS 1984
    toProjection                        // a Spherical Mercator Projection.

), icono.clone()));
             

// Se agrega otro marcador en el Layer de marcadores.
layer_marcador.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(-57.60558, -25.32612).transform(

    fromProjection,                     // Transformar from WGS 1984
    toProjection                        // a Spherical Mercator Projection.

), icono.clone()));
             

// Se agrega otro marcador en el Layer de marcadores.
layer_marcador.addMarker(new OpenLayers.Marker(new OpenLayers.LonLat(-57.60992, -25.30463).transform(
    fromProjection,                     // Transformar from WGS 1984
    toProjection                        // a Spherical Mercator Projection.

), icono.clone())); 

Ven lo fácil que es colocar varios marcadores en el mapa.
Para ver la documentación.

OBS:
  • Tienen que notar que después de crear el icono para un marcador, el resto de los nuevos marcadores se utiliza el método clone de icono.
  • El mapa utilizado es OpenStreetMap
  • La versión del OpenLayers es 2.11
El código que esta debajo para descargar incluye el ejemplo completo de los 4 marcadores. Ya incluye la librería OpenLayers, pero sin su documentación y sus ejemplos.
Descargar: Código Fuente

2 comentarios:

Anónimo dijo...

Gracias me salvo de una trasnochada la HP

Anónimo dijo...

grande master !!!! me salvaste la vida !! jajajjaa saludos desde CHILE

Publicar un comentario

Expresate y se crítico en tu vida. XD

Recibir Artículos Por Correo

Categorías

acertijos (1) adsense (1) adwords (1) AJAX (1) algoritmos (8) android (32) apple (5) autocad (1) base de datos (16) bash (1) becas (1) benchmark (1) blogger (2) blogs (27) bsd (1) buscadores (22) c# (1) CAD (1) camaras digitales (1) casting (1) CentOS (9) certificados (1) ciencia (1) CLEI (5) cloud computing (3) codigo fuente (9) Compiladores (4) Concursos (14) conferencias (24) congresos (6) consolas (7) criptografia (1) css (6) curso online (10) cursos (14) debian (50) Diseño (11) edicion video (7) emuladores (3) encuestas (2) entrevistas (9) ERTIC (1) etico (1) eventos (87) extjs (2) facebook (18) flash (2) flicker (1) FLISOL (13) geek (6) geoserver (2) GIMP (8) gis (29) Google (48) hacking (1) Hardware (30) haskell (3) HTML 5 (20) humor (261) imagenes (238) Ingenieria (14) internet (1) iphone (3) Java (42) Javascript (14) JQuery (3) juegos (36) libros (5) Linux (248) MAC (1) manga (2) Manuales (10) mapquest (1) MapServer (5) matematica (2) Microsoft (26) Microsoft Windows (27) Moviles (16) musicas (7) mysql (3) navegadores (41) newsletters (1) nokia (2) Noticias cientificas (7) Noticias Informaticas (39) Noticias varias (14) nube (1) openlayers (13) openstreetmap (10) opiniones (1) oracle (9) Paraguay (102) photoshop (1) Php (12) podcast (1) postgres (7) Programacion (135) prolog (1) proyectos (10) python (3) radio (6) Recursos (112) redes (10) Redes Sociales (62) resumenes (1) Revistas (57) ruby (2) seguridad (23) seminarios (6) sencha (2) SEO (3) Series (1) Silverlight (1) Sistema Operativo (27) smartphone (1) Software Libre (198) sun (2) tablet (19) tecnologia (24) tecnoPyensis (6) Testing (5) Trabajo (6) trucos (22) Twitter (29) Ubuntu (152) varios (113) videos (173) virtualizacion (14) visual basic net (2) web (86) wikipedia (1) Windows 7 (23) windows 8 (1) Windows XP (2) wordpress (5) xml (1)

Entradas Aleatorias

Seguidores

Últimos Comentarios

Archivos del Blog