Ver Mensaje Individual
  #2 (permalink)  
Antiguo 29/03/2010, 09:12
cpuser
 
Fecha de Ingreso: diciembre-2005
Ubicación: Mar del Plata
Mensajes: 146
Antigüedad: 18 años, 10 meses
Puntos: 2
Respuesta: Google Maps (Marcas mas cercanas a una dirección especifica)

Solucionado les dejo el código completo:

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin t&iacute;tulo</title>
<script type="text/javascript">
function copiar(frm) {
  frm.address.value = frm.provinciaList.value+' '+frm.localidadList.value+' '+frm.t3.value;
}
</script>  


<script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true
    &amp;key=ABQIAAAA8gk0hwIezlE4Mn3qRTySDhRDenltlsPu3NYhbY395MMDhCUItBQJ2hqC4ArFSPuYFwI8jNh3EyTJog"
    type="text/javascript"></script>
	
	
    <script type="text/javascript">
    //<![CDATA[

    // Inicialización de variables.
    var map      = null;
    var geocoder = null;

    function load() {                                      // Abre LLAVE 1.
      if (GBrowserIsCompatible()) {                           // Abre LLAVE 2.
        map = new GMap2(document.getElementById("map"));

        map.setCenter(new GLatLng(-38.00252047431972,-57.548789978027344), 12);
map.addControl(new GLargeMapControl());
map.addControl(new GMapTypeControl());
map.addControl(new GScaleControl());

        geocoder = new GClientGeocoder();

        //---------------------------------//
        //   MARCADOR AL HACER CLICK
        //---------------------------------//
        GEvent.addListener(map, "click",
            function(marker, point) {
                  if (marker) {
                       null;
                      } else {
                      map.clearOverlays();
                    var marcador = new GMarker(point);
                    map.addOverlay(marcador);
                    //marcador.openInfoWindowHtml("<b><br>Coordenadas:<br></b>Latitud : "+point.y+"<br>Longitud : "+point.x+"<a href=http://www.mundivideo.com/fotos_pano.htm?lat="+point.y+"&lon="+point.x+"&mapa=3 TARGET=fijo><br><br>Fotografias</a>");
                    //marcador.openInfoWindowHtml("<b>Coordenadas:</b> "+point.y+","+point.x);
                    document.form_mapa.coordenadas.value = point.y+","+point.x;
                    }
              }
            );
					getMarkers();
	      
	      GEvent.addListener(map, "click", function(overlay, point) {
		      if (overlay){	// marker clicked
			      overlay.openInfoWindowHtml(overlay.infowindow);	// open InfoWindow
		      } else if (point) {	// background clicked
			      
		      }
	      })
        //---------------------------------//
        //   FIN MARCADOR AL HACER CLICK
        //---------------------------------//

      } // Cierra LLAVE 1.
    }   // Cierra LLAVE 2.

    //---------------------------------//
    //           GEOCODER
    //---------------------------------//
	

	   
	
    function showAddress(address, zoom) {
        if (geocoder) {
            geocoder.getLatLng(address,
                  function(point) {
                    if (!point) {
                        alert(address + " no se ha encontrado, si esta dirección existe y no aparece en el mapa situa manualmente el punto en el mapa haciendo click donde este la ubicación dejando los campos del formulario correctamente");
                    } else {
                        map.setCenter(point, zoom);
                        var marker = new GMarker(point);
                        map.addOverlay(marker);
                        //marker.openInfoWindowHtml("<b>"+address+"</b><br>Coordenadas:<br>Latitud : "+point.y+"<br>Longitud : "+point.x+"<a href=http://www.mundivideo.com/fotos_pano.htm?lat="+point.y+"&lon="+point.x+"&mapa=3 TARGET=fijo><br><br>Fotografias</a>");
                        // marker.openInfoWindowHtml("<b>Coordenadas:</b> "+point.y+","+point.x);
                         document.form_mapa.coordenadas.value = point.y+","+point.x;
                       }
                   }
            );
          }}
    //---------------------------------//
    //     FIN DE GEOCODER
    //---------------------------------//
	

		  
	function getMarkers(){
		    var urlstr="mardel.php";
		    var request = GXmlHttp.create();
		    request.open('GET', urlstr , true);	// request XML from PHP with AJAX call
		    request.onreadystatechange = function () {
				if (request.readyState == 4) {
					var xmlDoc = request.responseXML;
					locations = xmlDoc.documentElement.getElementsByTagName("location");
					markers = [];
					if (locations.length){
						for (var i = 0; i < locations.length; i++) { // cycle thru locations
							markers[i] = new GMarker(new GLatLng(locations[i].getAttribute("lat"),locations[i].getAttribute("lng")));
							// Add attributes to the marker so we can poll them later.
							// When clicked, an overlay will have these properties.
							markers[i].infowindow = locations[i].getAttribute("name");
							
							// Useful things to store on a marker (Not needed for this example, could be removed)
							// Tells you what index in the markers[] array an overlay is
							markers[i].markerindex = i;
							// Store the location_id of the location the marker represents.
							// Very useful to know the true id of a marker, you could then make
							// AJAX calls to the database to update the information if you had it's location_id
							markers[i].db_id = locations[i].getAttribute("id");
							
							map.addOverlay(markers[i]);
							
						}
					}
				}
			}
			request.send(null);
	    }
	

    //]]>
     </script>



      <script type="text/javascript" src="http://www.diariothc.com/wp-content/codes/animatedcollapse.js"></script>
      <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=true
    &amp;key=ABQIAAAA8gk0hwIezlE4Mn3qRTySDhRDenltlsPu3NYhbY395MMDhCUItBQJ2hqC4ArFSPuYFwI8jNh3EyTJog"
    type="text/javascript"></script>  
</head>


     <body onLoad="load();"  onunload="GUnload();">

    <form name="form_mapa" action="#" onsubmit=" showAddress(this.address.value, this.zoom.value=parseFloat(this.zoom.value)); return false">

<input id="provinciaList" type="hidden" name="provinciaList" onkeyup="copiar(this.form)" />

<select name="localidadList" id="localidadList" onclick="copiar(this.form)" />
<option>Seleccione una localidad...</option>
<option>Mar del Plata</option>
<option>Mar de las Pampas</option>
<option>Ciudad Autonoma de Buenos Aires</option>
</select> 

<input id="t3" type=text name="t3" onkeyup="copiar(this.form)" />

<input class="situar" type="submit" value="Situar en mapa" />


<input type="hidden" name="address"  />

<input type="hidden" size="1" name="zoom" value=12 />

<div id="map" style="width: 432px; height: 300px"></div>


</form>

</body>  


</html>