Duda con Google Maps

jefeencubierto · #1 (**permalink**) 30/09/2009, 09:10

Buenas señoras/es,

Tengo una duda con google maps, la cosa es si podria ubicar un icono en el mapa simplemente con los datos de direccion, poblacion, provincia y pais, evitando poner las coordenadas exactas.

Tambien siguiendo el mismo tema quisiera saber si me podrian indicar como poner mas de un icono en el mapa, y que cada uno de estos iconos responda a una direccion diferente.

Gracias de antemano a todos, un saludo.

Phoenix23 · #2 (**permalink**) 30/09/2009, 10:01

Hola jefeencubierto,

Te voy a explicar como poner 2 punteros o mas en donde quieras.

Código:

function load() {
      if (GBrowserIsCompatible()) {
      
        var icon = new GIcon();
        icon.shadow = "../images/puntero_sombra.png";
        icon.iconSize = new GSize(40, 32);
        icon.shadowSize = new GSize(40, 32);
        icon.iconAnchor = new GPoint(30, 10);
        icon.infoWindowAnchor = new GPoint(31, 8);
        
        var puntero_html = "<h5><strong>Texto que quieras</strong></h5><p class='texto_globo'><br/><strong></strong></p><p class='texto_globo'><strong></strong><strong></strong></p>";
        var puntero = new GMarker(new GLatLng(43.271706,-2.234259), icon);
        GEvent.addListener(puntero, "click", function(){puntero.openInfoWindowHtml(puntero_html);});

		var puntero2_html = "<h5><strong>Texto que quieras</strong></h5><p><br/><strong></strong></p><p><strong></strong><strong>Fax:</strong> </p>";
        var puntero2 = new GMarker(new GLatLng(43.206677,-2.294769 ), icon);
        GEvent.addListener(puntero2, "click", function(){puntero2.openInfoWindowHtml(puntero2_html);});

        var map = new GMap2(document.getElementById("map"));
        map.setCenter(new GLatLng(43.271706,-2.234259), 10);
   // 	map.setMapType(G_HYBRID_MAP);
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
    	map.addOverlay(puntero);
    	map.addOverlay(puntero2);

      }
    }

icon.shadow: Esta es la imagen que has echo tu y que quieras que aparezca como puntero en el mapa.

var puntero_html = Este es un puntero. Lo que viene entre las comillas es el texto que quieras ponerle tu en el globo que sale al pinchar en el puntero. puedes usar codigo html para resaltar el telefono, el fax,etc....

var puntero = new GMarker(new GLatLng(43.271706,-2.234259), icon); esto es la posicion donde quieres que aparezca el icono.

map.setCenter(new GLatLng(43.271706,-2.234259), 10);: esto es el centro del mapa.

donde quieres que salga el mapa ( por ejemplo contacto.php), le pones la API key asi:

<script language="javascript" type="text/JavaScript" src="js/mapa.js"></script>

Código:

<script src="http://maps.google.com/maps?file=api&amp;v=APIKEY" type="text/javascript" charset="utf-8"></script>

y luego, en la misma página <body onload="load();" onunload="GUnload()" >

Espero haberme explicado bien y espero que te sirva

Saludos

GatorV · #3 (**permalink**) 30/09/2009, 12:52

Tema trasladado desde PHP

Phoenix23 · #4 (**permalink**) 01/10/2009, 01:53

Hola,

Lo de las coordenadas no se como hacer, porque quieres sin coordenadas? quieres que meta el usuario, la direccion o algo asi?

jefeencubierto · #5 (**permalink**) 01/10/2009, 10:59

Buenas tardes,

La cosa es que el usuario no tenga que hacer nada. Digamos que existe un formulario donde se recogen los datos personales, el usuario me puede indicar la dirección donde esta pero difícilmente la ubicación mediante longitud y latitud.

jefeencubierto · #6 (**permalink**) 07/10/2009, 16:40

Bueno parece que ya encontré una solución para mostrar un mapa de google partiendo de la dirección. Para probarlo solo hay que inicializar en el onload la funcion loading() y tener un campo hidden llamado dirección que contenga valga la redundancia la dirección tipo [dirección, provincia], ej.[Avenida Diagonal 50, Barcelona]

Código:

   <script de api de google>

    <script type="text/javascript"> 
    
 	function loading() { 
     
	 	//Direccion
		var direccion= document.getElementById("direccion").value; 
		
       if (GBrowserIsCompatible()) {
			var map = new GMap2(document.getElementById("map"));
			map.setCenter(new GLatLng(0,0), 0);
			map.addControl(new GSmallMapControl());
			map.addControl(new GScaleControl());
			map.addControl(new GMapTypeControl());
			GEvent.addListener(map, "click", function(overlay, point){ 
				if(overlay){ 
					if(overlay.title)
						map.openInfoWindowHtml(overlay.getPoint(), overlay.title);
				}
			});
			var geocoder = new GClientGeocoder();
			geocoder.getLatLng(direccion, function(point) {
				if (!point) {
					alert("Lugar no encontrado");
				} else {
					map.setCenter(point, 15);    // 12 indica el valor de zoom
					var center = new GMarker(map.getCenter());
					center.title = "albacete";
					map.addOverlay(center);
					map.openInfoWindowHtml(center.getPoint(), center.title);
				}
			});
			var center = new GMarker(map.getCenter());
    		center.title = "Centro del mapa";
			map.addOverlay(center);
			map.openInfoWindowHtml(center.getPoint(), center.title);
		}
    }
    //]]>
    </script>