Klikalny kierunek jazdy w Google Maps v3
Robię projekt map google i muszę utworzyć trasę klikając na niego.
Mój projekt ma 2 punkty, które mają predefiniowane lat i lng, i chcę sam narysować początek i koniec punktu A i B i nie stracić jego funkcjonalności.
Zrobiłem kolejny projekt, który możesz kliknąć, aby narysować trasę, ale nie ma znaczników i nie można go przeciągać,to jest mój rzeczywisty projekt z pełnym kodem opublikuję tutaj krótki kod tylko z moimi wskazówkami.
Chcę, aby moje pierwsze kliknięcie do punktu A i drugie do mojego punktu B, a także możliwość ich przeciągnięcia, tak jak w projekcie połączonym
function goma()
{
var mapDiv = document.getElementById('mappy');
var mapOptions = {
zoom: 12,
center: new google.maps.LatLng(-23.563594, -46.654239),
mapTypeId : google.maps.MapTypeId.ROADMAP
}
pode ser ROADMAP, SATELLITE, HYBRID, TERRAIN
map = new google.maps.Map( mapDiv, mapOptions );
//Render route, etc.
ren = new google.maps.DirectionsRenderer( {'draggable':true} );
ren.setMap(map);
ren.setPanel(document.getElementById("directionsPanel"));
ser = new google.maps.DirectionsService();
//Create the route
ser.route({ 'origin': new google.maps.LatLng(-23.563594, -46.654129), 'destination': new google.maps.LatLng(
-23.563672, -46.640396), 'travelMode': google.maps.DirectionsTravelMode.DRIVING},function(res,sts) {
if(sts=='OK')ren.setDirections(res);
})
}
Aktualizuję tutaj mój kod, zrobiłem tylko sposób A, to jest pierwszy punkt trasy, drugi to predefiniowane narzędzie latLng, w którym klikniesz, pobiera latLng i umieszcza wewnątrz „pochodzenie”.
google.maps.event.addListener(map, "click", function(event) {
wayA = new google.maps.Marker({
position: event.latLng,
map: map
});
});
ren = new google.maps.DirectionsRenderer( {'draggable':true} );
ren.setMap(map);
ren.setPanel(document.getElementById("directionsPanel"));
ser = new google.maps.DirectionsService();
ser.route({ 'origin': wayA, 'destination': new google.maps.LatLng(
-23.563672, -46.640396), 'travelMode': google.maps.DirectionsTravelMode.DRIVING},function(res,sts) {
if(sts=='OK')ren.setDirections(res);
})