Довольно прямой вопрос.
В настоящее время я реализовал карту Google на своем сайте. До сих пор мне удавалось редактировать, какие данные отображаются на маркере и как именно оформляются эти данные.
Я застрял на одном последнем пункте. Мне нужно предоставить посетителям возможность нажать «Проложить маршрут». У меня есть ссылка на маркер под названием "Направления". Я хотел бы, чтобы посетители могли щелкнуть это «каким-то образом» и предоставить им указания. Я не уверен в средствах или в том, как это достигается. Я искал везде. Любая помощь будет принята с благодарностью. Я включил снимок экрана моего маркера.
Скриншот маркера/карты http://postimg.org/image/t5v5hy7yj/
Кроме того, при ответе относитесь ко мне как к человеку, который знает только основы того, что требовалось для этого до сих пор. Спасибо!
ИЗМЕНИТЬ *
Я отредактировал его так, что когда они нажимают ссылку «направления», она принимает команду поиска карты Google и помещает в нее то, что я приказываю ей из базы данных mysql. Им по-прежнему нужно будет еще раз щелкнуть маршрут на странице результатов Google, чтобы проложить маршрут. Мне нужен более прямой способ сделать это! знак равно
downloadUrl("genxml.php", function(data) {
var xml = data.responseXML;
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
var name = markers[i].getAttribute("name");
var type = markers[i].getAttribute("type");
var address = markers[i].getAttribute("address");
var city = markers[i].getAttribute("city");
var state = markers[i].getAttribute("state");
var zip = markers[i].getAttribute("zip");
var phone = markers[i].getAttribute("phone");
var url = markers[i].getAttribute("url");
var point = new google.maps.LatLng(
parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var html =
'<a href="' + url + '" target="blank">' + name + '</a>' +
'</a><br/><br/>' + address +
'<br>' + city + ' ' + state + ' ' + zip +
'<br/>' + phone +
'<hr style="border: none; height: 1px; color: blue; background: grey;"/>' +
'<a href="https://maps.google.com/maps?q='+ address + ' ' + city + ' ' + state + ' ' + zip + '" target="blank"><u>Directions</u></a> ' + ' <a href="#"><u>Write a Review</u></a> ' + ' <a href="#"><u>more</u></a>' +
'<hr style="border: none; height: 1px; color: blue; background: grey;"/>' +
'<?php echo $ads ?>';
var icon = customIcons[type] || {};
var marker = new google.maps.Marker({
map: map,
position: point,
icon: icon.icon,
shadow: icon.shadow
});
bindInfoWindow(marker, map, infoWindow, html);
}
});
}
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
function downloadUrl(url, callback) {
var request = window.ActiveXObject ?
new ActiveXObject('Microsoft.XMLHTTP') :
new XMLHttpRequest;
request.onreadystatechange = function() {
if (request.readyState == 4) {
request.onreadystatechange = doNothing;
callback(request, request.status);
}
};
request.open('GET', url, true);
request.send(null);
}
function doNothing() {}