I am trying to panTo an area on a map on click. The script is not working and page reloading. Perhaps someone can see the problem.
My function
function clickroute(lati,long) {
map = google.maps.Map(document.getElementById("map_canvas"));
map.panTo(lati,long)
}
And the rest
var directionDisplay;
var directionsService = new google.maps.DirectionsService();
var map;
function initialize() {
geocoder = new google.maps.Geocoder();
directionsDisplay = new google.maps.DirectionsRenderer();
var chicago = new google.maps.LatLng(41.850033, -87.6500523);
var myOptions = {
zoom:10,
mapTypeId: google.maps.MapTypeId.ROADMAP,
center: chicago
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var address = 'virginia water';
geocoder.geocode( { 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
}
});
directionsDisplay.setMap(map);
}
function calcRoute() {
var start = document.getElementById("start").value;
var end = document.getElementById("end").value;
var request = {
origin:start,
destination:end,
travelMode: google.maps.DirectionsTravelMode.DRIVING
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(response);
}
});
}
And my event
<a href="" onclick="clickroute(51.433373, -0.712251)">test</a>
The issue is that your using map.panTo(latitude,longitude)
but the google maps API uses this: panTo(latLng myLatLng)
where latLng
is a google map class.
try something like this (untested)
function clickroute(lati,long) {
var latLng = new google.maps.LatLng(lati, long); //Makes a latlng
map.panTo(latLng); //Make map global
}
Look here for more info.
EDIT As someone else stated you don't want to remake a new map. Maybe its easier to make it global?
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With