Buongiorno a tutti, vorrei gentilmente un aiuto per risolvere in mio problemino.
vorrei implementare nella Google Maps API v3 la possibilità di calcolare il percorso come avevo fatto a suo tempo su la Google Maps API v2 ma non ci riesco proprio...
------------------------------------------------------------------------------------
Esempio di mappa_base_V2 con itinerario
<body onload="initialize()" onunload="GUnload()">
<script src=" http://maps.google.com/?file=api&v=2...SERIRE_KEY_API" type="text/javascript"></script>
<script type="text/javascript">
var map;
var gdir;
var geocoder = null;
var addressMarker;
function initialize() {
if (GBrowserIsCompatible()) {
map = new GMap2(document.getElementById("map_canvas"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(45.476744,9.20738), 13);
var marker = new GMarker(new GLatLng(45.476744,9.20738))
map.addOverlay(marker);
marker.openInfoWindowHtml("Nome Negozio
Corso Buenos Aires 14
20129 Milano");
gdir = new GDirections(map, document.getElementById("directions"));
GEvent.addListener(gdir, "error", handleErrors);
}
}
function setDirections(fromAddress) {
locale="it";
gdir.load("from: " + fromAddress + " to: Corso Buenos Aires, 14, 20129 Milano");
}
function handleErrors(){
if (gdir.getStatus().code == G_GEO_UNKNOWN_ADDRESS)
alert("Indirizzo non trovato");
else if (gdir.getStatus().code == G_GEO_SERVER_ERROR)
alert("Si è verificato un errore nella geocodifica degli indirizzi");
else if (gdir.getStatus().code == G_GEO_MISSING_QUERY)
alert("Manca un parametro");
else if (gdir.getStatus().code == G_GEO_BAD_KEY)
alert("Errore nella Key Api.");
else if (gdir.getStatus().code == G_GEO_BAD_REQUEST)
alert("La richiesta non puo' essere correttamente risolta.");
else alert("Si è verificato un errore");
}
</script>
<div id="map_canvas" style="width: 420px; height: 400px"></div>
<div id="location">
<form action="#" onsubmit="setDirections(this.partenza.value); return false">
parti da:<input type="text" name="partenza"><input type="submit" value="Calcola">
</form>
</div>
<div id="directions" style="width: 420px"></div>
</body>
---------------------------------------------------------------------------------------
esempio mappa_base_V3.html
<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>Associazione</title>
<style type="text/css">
html, body { margin:; padding:10; width:100%; height:100%; }
body { background:#FFFFFF; color:#000000; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:150%; text-align:center;}
#map { width:50%; height:70%; }
#tooltip { padding:10px; text-align:left; width:400px; }
#tooltip p, #tooltip img { float:left; display:inline; padding:0; margin:0 10px 0 0; }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
var initialize = function() {
var latlng = new google.maps.LatLng(45.476744,9.20738);
var options = {
zoom: 12,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById('map'), options);
var marker = new google.maps.Marker(
{
position: latlng,
map: map,
icon: 'http://google-maps-icons.googlecode.com/files/home.png',
title: 'Associazione',
flat: true
}
);
var tooltip = '<div id="tooltip">'+
'[img]logo.jpg[/img]'+
'
Associazione
'+
'..........
'+
'........, ....
'+
'Cap: .....
'+
'........
'+
'...........</p>'+
'</div>';
var infowindow = new google.maps.InfoWindow({
content: tooltip
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
}
window.onload = initialize;
</script>
</head>
<body>
<div id="map">
</div>
</body>
</html>
perdonate le mie scarse capacita ... vorrei inserirlo in un sito NoProfit
ringrazio fin da subito per l'aiuto
Rispondi quotando
