2013-07-03 5 views
1

오히려 직선적 인 질문입니다.Google지도 아이콘 : '길 찾기'옵션이 필요합니다.

저는 현재 내 사이트에서 Google지도를 구현했습니다. 필자는 지금까지 마커에 표시되는 데이터와 그 데이터의 스타일을 정확하게 편집 할 수있었습니다.

마지막 지점이 하나 있습니다. 방문자에게 '길 찾기'를 클릭 할 수있는 옵션을 제공해야합니다. 마커에 '길 찾기'라는 링크가 있습니다. 방문자가 '어떻게 든'이것을 클릭하고 방향을 제공 할 수 있기를 바랍니다. 나는 방법이나 이것이 어떻게 성취되었는지 확신하지 못합니다. 나는 사방을 보았다. 어떤 도움이라도 대단히 감사하겠습니다. 내 마커의 스크린 샷을 포함 시켰습니다. 마커의

스크린 샷 /지도에 응답 할 때 http://postimg.org/image/t5v5hy7yj/

는 또한, 지금까지이 작업을 수행하는 데 필요한 있었는지의 기초를 아는 사람으로 저를 취급합니다. 감사!

편집 * 내가 편집 한

그래서 그들은 내가 MySQL 데이터베이스에서에 계명은 그 안에 구글지도 검색 명령과 장소를 취하는 '방향'링크를 쳤을 때. 길 찾기를하려면 지금 Google 결과 페이지에서 길 찾기를 한 번 더 클릭해야합니다. 더 직접적인 방법이 필요합니다! =)

정보창에 대한 HTML 문자열에서
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() {} 
+0

트롤 얼굴은 무엇입니까? – Ron

+0

은 다음과 같습니다. http://www.christlivingchurch.com/home/directions.html#directions_table (이 사이트를 개발했습니다) – Ron

+0

완료 방법이 중요한지 확실하지 않습니다. '방법'만큼이나. 나는 어디서부터 시작해야할지 모르겠습니다. 내지도에는 1 만 개 이상의 마커가 있습니다. 방문자가 마커를 클릭 할 수 있어야하고 어떻게 든 마커의 주소로 길 찾기 옵션이 있어야합니다. – user2526699

답변

1

,이 같은 자바 스크립트 함수를 호출하는 onclick 매개 변수를 추가 : https://developers.google.com/maps/documentation/javascript/examples/directions-simple

: showDirections(" + address + "," + city + "," + state + "," + ")

이 링크는 방향을 표시하는 기능을 만들 수 있도록해야한다

+0

확실하지 않습니다. 내지도에있는 마커를 클릭하고 그 마커의 길을 찾아야합니다. – user2526699

+0

잠깐만이라도 그렇게 할 수있는 코드를 얻을 수 있습니다. 나는 방법이 있다고 생각하지만, 코드 샘플을 줄 수 있다면 도움이 될 것입니다. – nbura

+0

그래, 좋을거야. 나에게 몇 가지를 줘, 나는 그것을 게시 할 것이다. 마지막 한 가지 시도. – user2526699