Ayuda con proyecto GoogleMaps
Publicado por Juan Manuel (1 intervención) el 09/01/2015 20:09:30
¡ Hola !
Estoy realizando un proyecto web en NetBeans en el que tengo que incorporar la API v3 de Google Maps, hace tiempo encontré unos scripts que cargan todo Google Maps en si. Anteriormente la forma de buscar ubicaciones era introduciendo dentro del script en los campos from: y to: , de esta manera funcionaba perfectamente y mostraba tanto la ruta en mapa como el itinerario. Sin embargo, para realizar correctamente el proyecto quiero que sea desde la web donde se introduzcan los campos de origen A: y destino B: para ello e creado dentro del script variables que guardarán esta información y posteriormete al hacer click en "Ver ruta" se carga el método load() que es el encargado de cargar todo Google Maps. Sin embargo, no se donde estoy teniendo errores ya que al introducir los datos de la ruta esta no se me muestra.
Por lo que después de dedicarle muchas horas a tratar de corregir el problema y no conseguir el resultado esperado he decidido pedir ayuda en esta web, ya que es una web en la que confío que puedan ayudarme y siempre me ha resultado útil para documentarme en proyectos de programación. A continuación les pongo el código fuente del proyecto NetBeans, se ejecuta íntegramente desde indexMap.xhtml, espero que ustedes puedan ayudarme.
Muchísimas gracias de antemano. !!
P.D. Las direcciones distinguen este formato [(Calle - C/), nombre de la vía, (Poner el nombre del distrito - código postal)]
CÓDIGO DEL PROYECTO
---------------------------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!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" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAA1gybajGje1CxFHgzphPqhBTkhzudNWd_u13Cffh29fB-9TXQzxQVh6gduUCW9NeYlGOi-AFsvIHQpg"
type="text/javascript"></script>
<script type="text/javascript">
function load(){
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("mapa"));
map.setCenter(new GLatLng(40.674389,-4.700432), 15); //Centramos vista en coordenadas de madrid a zoom 15
panel_ruta = document.getElementById("direcciones");
ruta = new GDirections(map, panel_ruta);
var porSalida=document.getElementsByName("salida")[0].value;
var porDestino=document.getElementsByName("destino")[0].value;
ruta.load("from:" + porSalida + "to:" + porDestino,{locale: 'es_ES'}); //Elegimos destinos
// Antiguamente -> ruta.load("from: Madrid to: Barcelona ",{locale: 'es_ES'}); //Elegimos destinos
}
}
</script>
<title> GOOGLE MAPS API V3 </title>
<style type="text/css">v\:* {behavior:url(#default#VML);}
</style>
</head>
<body onload="load();" onunload="GUnload();">
<h1></h1>
<table>
<tr>
<th>- Itinerario de ruta -</th><th>- Vista de la ruta -</th>
</tr>
<tr>
<form>
//Elegimos destinos
A: <input type="text" name="salida" value="" size="100" /><p></p>
B: <input type="text" name="destino" value="" size="100" /><p></p>
<input type="button" value="Ver ruta" onclick="load()"/> //Cargar Script
</form>
</tr>
<tr>
<td valign="top"> <div id="direcciones" style="width: 530px;"></div></td>
<td valign="top"><div id="mapa" style="width: 600px; height: 600px; "></div></td>
</tr>
</table>
</body>
</html>
Estoy realizando un proyecto web en NetBeans en el que tengo que incorporar la API v3 de Google Maps, hace tiempo encontré unos scripts que cargan todo Google Maps en si. Anteriormente la forma de buscar ubicaciones era introduciendo dentro del script en los campos from: y to: , de esta manera funcionaba perfectamente y mostraba tanto la ruta en mapa como el itinerario. Sin embargo, para realizar correctamente el proyecto quiero que sea desde la web donde se introduzcan los campos de origen A: y destino B: para ello e creado dentro del script variables que guardarán esta información y posteriormete al hacer click en "Ver ruta" se carga el método load() que es el encargado de cargar todo Google Maps. Sin embargo, no se donde estoy teniendo errores ya que al introducir los datos de la ruta esta no se me muestra.
Por lo que después de dedicarle muchas horas a tratar de corregir el problema y no conseguir el resultado esperado he decidido pedir ayuda en esta web, ya que es una web en la que confío que puedan ayudarme y siempre me ha resultado útil para documentarme en proyectos de programación. A continuación les pongo el código fuente del proyecto NetBeans, se ejecuta íntegramente desde indexMap.xhtml, espero que ustedes puedan ayudarme.
Muchísimas gracias de antemano. !!
P.D. Las direcciones distinguen este formato [(Calle - C/), nombre de la vía, (Poner el nombre del distrito - código postal)]
CÓDIGO DEL PROYECTO
---------------------------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!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" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<script src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAA1gybajGje1CxFHgzphPqhBTkhzudNWd_u13Cffh29fB-9TXQzxQVh6gduUCW9NeYlGOi-AFsvIHQpg"
type="text/javascript"></script>
<script type="text/javascript">
function load(){
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("mapa"));
map.setCenter(new GLatLng(40.674389,-4.700432), 15); //Centramos vista en coordenadas de madrid a zoom 15
panel_ruta = document.getElementById("direcciones");
ruta = new GDirections(map, panel_ruta);
var porSalida=document.getElementsByName("salida")[0].value;
var porDestino=document.getElementsByName("destino")[0].value;
ruta.load("from:" + porSalida + "to:" + porDestino,{locale: 'es_ES'}); //Elegimos destinos
// Antiguamente -> ruta.load("from: Madrid to: Barcelona ",{locale: 'es_ES'}); //Elegimos destinos
}
}
</script>
<title> GOOGLE MAPS API V3 </title>
<style type="text/css">v\:* {behavior:url(#default#VML);}
</style>
</head>
<body onload="load();" onunload="GUnload();">
<h1></h1>
<table>
<tr>
<th>- Itinerario de ruta -</th><th>- Vista de la ruta -</th>
</tr>
<tr>
<form>
//Elegimos destinos
A: <input type="text" name="salida" value="" size="100" /><p></p>
B: <input type="text" name="destino" value="" size="100" /><p></p>
<input type="button" value="Ver ruta" onclick="load()"/> //Cargar Script
</form>
</tr>
<tr>
<td valign="top"> <div id="direcciones" style="width: 530px;"></div></td>
<td valign="top"><div id="mapa" style="width: 600px; height: 600px; "></div></td>
</tr>
</table>
</body>
</html>
Valora esta pregunta
0