Hello, I'm a Google Maps API beginner but I'm loving it :-D.
You can see below my first test code, when for instance the ALOJAMIENTO option from the select is selected, I want to hide and show divs and then change the center of the map (map.setCenter). This last thing is what I can achieve, inside verAlojamiento() function, it seems that no map utilities are working, why? Is my problem related with some AJAX issue? Can you help me please with this problem? Thank you very much for your attention, Héctor <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";> <!-- to show polylines on the map and for IE introducimos xmlns:v="urn:schemas-microsoft-com:vml" --> <html xmlns="http://www.w3.org/1999/xhtml"; xmlns:v="urn:schemas- microsoft-com:vml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/ > <title>Google Maps JavaScript API Example</title> <!--jsapi (por el tema AJAX, hl=es (espanyol algunas cosas), luego la clave de Google--> <script src="http://www.google.com/jsapi? hl=es&key=ABQIAAAAcuNWuLxitoqmG8XAeDq3XxR50vRx2JwqkJ1lttQZMXeo7oyW- hQ3OfDOQ3LsQxZgKytP1kuDZcc_0w" type="text/javascript"></script> <script type="text/javascript"> //The AJAX API loader can be included dynamically on your website.This is done by passing a callback option in the third parameter. google.load("maps", "2"); //<![CDATA[ function mapsLoaded() { if (google.maps.BrowserIsCompatible()) { var map = new google.maps.Map2(document.getElementById("map")); map.addControl(new google.maps.SmallMapControl()); map.addControl(new google.maps.MapTypeControl()); map.setCenter(new google.maps.LatLng(39.681, -0.277), 9); //marcador inicial Sagunto var point = new google.maps.LatLng(39.681, -0.277); map.addOverlay(new google.maps.Marker(point)); }; }; function manejarSeleccion() { var opcion = document.getElementById("listado").value; if (opcion == "llegar") { window.open("http://maps.google.es/maps? f=d&saddr=&daddr=Sagunto&hl=es&geocode=&mra=mi&sll=39.635307,-0.373535&sspn=0.960297,1.768799&ie=UTF8&z=9", "ventana1","width=800,height=600,scrollbars=NO" ); } else if (opcion == "alojamiento") { verAlojamiento(); } else if (opcion == "gastronomia") { verGastronomia(); } else if (opcion == "turismo") { verTurismo(); } else if (opcion == "romeu") { verRomeu(); } else if (opcion == "microsprint") { verMicrosprint(); } else if (opcion == "sprint") { verSprint(); }; }; function verAlojamiento() { hideDiv("barra_lateral"); showDiv("alojamiento"); map.setCenter(new google.maps.LatLng(39.7121, -0.2942), 12); } function verGastronomia() { hideDiv("barra_lateral"); showDiv("gastronomia"); } function verTurismo() { hideDiv("barra_lateral"); showDiv("turismo"); } function verRomeu() { hideDiv("barra_lateral"); showDiv("romeu"); } function verMicrosprint() { hideDiv("barra_lateral"); showDiv("microsprint"); } function verSprint() { hideDiv("barra_lateral"); showDiv("sprint"); } function showDiv(divId) { document.getElementById(divId).style.display = "block"; } function hideDiv(divId) { document.getElementById(divId).style.display = "none"; } google.setOnLoadCallback(mapsLoaded); //]]> </script> </head> <!-- Gestión de la memoria --> <body onunload="google.maps.Unload()"> <table border="0"> <tr> <td> <!-- en este div se creará el mapa --> <div id="map" style="width: 300px; height: 200px; border- width: 2px; border-style: solid; border-color: orange"> </div> </td> <td> <!-- resto de divs, la barra lateral inicial y todos los subdivs --> <div id="barra_lateral"> Elige la opción deseada de la siguiente lista: <br /> <select id="listado" size="9" onchange="manejarSeleccion()"> <optgroup label="Información general"> <option value="llegar">¿Cómo llegar?</option> <option value="alojamiento">Alojamiento</option> <option value="gastronomia">Gastronomía</option> <option value="turismo">Información turística</option> </optgroup> <optgroup label="Información competición"> <option value="romeu">Liga autonómica - Romeu</option> <option value="microsprint">MicroSprint</option> <option value="sprint">Sprint</option> </optgroup> </select> </div> <div class="subDiv" id="alojamiento" style="display: none;">Alojamientos</div> <div class="subDiv" id="gastronomia" style="display: none;">Gastronomia</div> <div class="subDiv" id="turismo" style="display: none;">Turismo</div> <div class="subDiv" id="romeu" style="display: none;">Romeu</ div> <div class="subDiv" id="microsprint" style="display: none;">Micro</div> <div class="subDiv" id="sprint" style="display: none;">Sprint</div> <a href="index.html">VOLVER</a> </td> </tr> </table> </body> </html> --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Maps API" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [EMAIL PROTECTED] For more options, visit this group at http://groups.google.com/group/Google-Maps-API?hl=en -~----------~----~----~----~------~----~------~--~---
