Ciao a tutti,
ho una pagina php che, tramite JS e PHP, ottiene due indirizzi e calcola il percorso a piedi.
Io riesco ad impostare correttamente i due indirizzi ma non riesco a far vedere la mappa, ci sarà un problema in JS.
Ci sto sbattendo la testa da due giorni e non capisco dove sia il problema!
Ho preso l'esempio "Google Maps Api 3: Geocoding" di HTML.it" e invece di usare <select> ho usato <input text> ma non riesco a far vedere la mappa!
Pongo qui il codice della pagina PHP:
codice:<html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>Ottieni direzione a piedi</title> <style type="text/css"> html, body { margin:0; padding:0; width:100%; height:100%; } body { background:#FFFFFF; color:#000000; font-family:Arial, Helvetica, sans-serif; font-size:11px; line-height:150%; text-align:center;} #map { float:left; width:70%; height:95%; } #panel { float:left; width:30%; height:95%; } #panel table { font-size:10px; } input { width:250px; } </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true&&language=it"></script> <script type="text/javascript"> var directionDisplay; var directionsService = new google.maps.DirectionsService(); var map; function inserimentoIndirizzo() { document.getElementById('partenza').value = prompt("Inserisci l'indirizzo di partenza:", "Viale Franco Angeli, 5 - Roma"); } function initialize() { calcRoute(); directionsDisplay = new google.maps.DirectionsRenderer(); var myOptions = { zoom:7, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map"), myOptions); directionsDisplay.setMap(map); directionsDisplay.setPanel(document.getElementById("panel")); //Prima di "input" era select var selectTags = document.getElementsByTagName("input"); //Fine cambiamento for(i=0;i<selectTags.length;i++){ selectTags[i].onchange=function(){ calcRoute(); }; } } function calcRoute() { var partenza = document.getElementById("partenza").value; var arrivo = document.getElementById("arrivo").value; var request = { origin:partenza, destination:arrivo, travelMode: google.maps.DirectionsTravelMode.WALKING }; directionsService.route(request, function(response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); } }); } window.onload = initialize; </script> </head> <body onLoad='inserimentoIndirizzo();'> <div> Partenza: <input id="partenza" name="partenza" type="text" /> Arrivo: <?php $indirizzo = $_POST['indirizzoArrivo']; echo("<input id='arrivo' name='arrivo' value='$indirizzo' type='text' />"); ?> </div> <div id="map"></div> <div id="panel"></div> </body> </html>
Rispondi quotando
