응용 프로그램은 다음과 같이 작동합니다. 사용자가 시작 위치와 거리를 입력합니다. 사용자는 도로 위에 원 또는 선을 그릴 수 있습니다. 서클이 정상적으로 작동합니다. 작업하는 데 사용 된 선.Google Maps API v3 폴리선이 그려지지 않음
Lines에서 코드는 시작 위치의 위도/경도를 찾은 다음 사용자가 설정 한 거리 (예 : 100km)의 원점 N, S, E, W 점을 찾습니다. N 목적지에서 시작하여 코드는 google.maps.DirectionsService()를 호출하여 원점에서 N까지의 길 찾기를 가져옵니다. 그러면 route.overview_path에 lat/long 배열이 반환됩니다.
참고 : directionsRenderer()을 사용하여 경로를 그리는 것은 가능하지만 그려지는 거리는 사용자가 설정 한 거리보다 커야합니다. 원점에서 N 점까지의 전체 경로를 그리는 것은 도로를 따라 124km 일 수 있으며, 단지 100km를 그립니다.
대신 route.overview_path [] 배열을 훑어 그 점과 원점 사이의 거리를 확인하고 각 점을 새 배열에 추가합니다. 거리가 사용자가 설정 한 dist보다 크면 멈추고 마지막 요소를 끈 다음 두 번째 작은 배열을 기반으로 새 폴리선을 만듭니다.
Chrome의 개발자 모드에서 하루 종일 자바 스크립트를 사용하고 중단 점을 설정하고 현지인을 보았습니다. google.maps.Polyline ({})에 전달 된 점 배열은 고유 한 점 . 왜 렌더링하지 않는지 알 수 없습니다.
궁극적으로 코드는 원점에서 시작하여 북쪽으로 향하는 하나의 행, 동쪽, 남쪽 및 서쪽으로 향하는 행에서 4 줄을 그립니다. 등 ....
코드는 여기에 있습니다 :
http://whosquick.com/RunViz.html이 관심을 가져 주셔서 감사합니다.