웹 사이트에 Google지도 운전 경로 추가

A 지점에서 B 지점으로가는 데 필요한 많은 매핑 앱과 서비스가 있지만지도의 확실한 왕은 Google지도입니다. 내 컴퓨터, 태블릿 및 90 %의 시간에 스마트 폰에서 사용합니다. 최고의 데이터, 가장 많은 탐색 및 라우팅 옵션, 스트리트 뷰, 도보, 자전거 및 대중 교통 정보와 같은 멋진 기능을 제공합니다..

그러나 Google 웹 사이트 외부에서지도 나 길 찾기를 사용해야하는 경우에는 어떻게해야합니까? 자신의 웨딩 웹 사이트 또는 개인 블로그가 있으며 게스트가 사이트를 방문하고 그들이 올 주소를 입력하면 자동으로 이벤트 위치에 대한 길 찾기를 할 수 있다고 가정합니다!

글쎄, 당신이 이것을 달성에 대해 갈 수있는 두 가지 방법이 있습니다. 가장 쉬운 방법은 Google지도에서 생성 된 소스 코드를 사용하여 웹 페이지에지도를 간단하게 삽입하는 것입니다. 두 번째 방법은 좀 더 기술적이지만 사용자 정의가 가능하고 동적입니다. 아래 두 가지 방법을 모두 언급하겠습니다..

Google지도 퍼가기

한 위치에서 다른 위치로 길 찾기 만 표시하려면 가장 쉬운 방법은 소스 코드를 사용하여보고있는지도를 포함하는 것입니다. 먼저 Google지도에서 원하는 방향을 설정 한 다음 페이지 오른쪽 하단의 톱니 바퀴 아이콘을 클릭하십시오..

클릭 지도 공유 또는 퍼가기 그런 다음 지도 퍼가기 탭. 여기에서지도 크기를 선택한 다음 iframe 코드를 복사하여 원하는 웹 페이지에 놓을 수 있습니다..

이 방법의 유일한 단점은 사용자가 정적지도를 보는 것입니다. 아래의 두 번째 방법에서는 사용자가 시작 주소를 입력 할 수있는 양식을 만들고 해당 주소에서 선택한 대상 주소로지도를 생성합니다.

Google지도 양식 만들기

두 번째 방법의 의미를 설명하려면 아래 상자에 미국 주소를 입력하여 현재 위치에서 집까지가는 길을 찾으십시오.

응? 어떤 웹 사이트, 블로그 또는 일부 HTML 코드에 삽입 할 수있는 곳이라면이 작은 양식을 쉽게 만들 수 있습니다! 이것은 주소록을 복사하고 새 창을 연 다음 시작 주소를 입력하는 대신 연락처 페이지에 버릴 수 있으므로 사람들이 중소 기업 웹 사이트에 유용합니다..

그러면 수정 된 길 찾기 상자를 만드는 방법에 대해 어떻게 알 수 있습니까? 우선 Google에서 길 찾기에 사용하는 URL에 대한 올바른 구문을 가져와야합니다. 운 좋게도 두 곳 사이의 길 찾기를하고 주소창에서 URL을 복사하면됩니다. 페이지 오른쪽 하단에있는 작은 톱니 바퀴 아이콘을 클릭하고 지도 공유 또는 퍼가기.

공유 링크 탭에는 브라우저 주소 표시 줄의 URL과 동일한 URL이 포함됩니다. 나는 아래에 전체 URL을 붙여 넣기 만하면 어떻게 보이는지 보여줍니다..

https://www.google.com/maps/dir/3600+Thorp+Springs+Dr,+Plano,+TX+75025,+USA/ 854 + Deerfield + Rd, + Allen, + TX + 75013, + USA / @ 33.1125686, -96.7557749,13z / data =! 3m1! 4b1! 4m13! 4m12! 1m5! 1m1! 1s0x864c3d45018517a5 : 0xbabd3c91a1321997! 2m2! 1d-96.762484! 2d33.08947! 1m5! 1m1! 1s0x864c16d3018a7f4f : 0xab2052b5786cd29f! 2m2! 1d-96.666151! 2d33.133892

Yikes! 꽤 길다! 거기에 많은 것들이 있는데, 대부분은 이해가 안됩니다! Google Maps URL 매개 변수는 매우 쉽고 간단하지만 새로운 URL 구조는 상당히 복잡합니다. 다행히 이전 매개 변수를 사용할 수 있으며 Google은 자동으로 새 매개 변수로 변환합니다. 무슨 뜻인지 알아 보려면 아래 링크를 확인하십시오..

http://maps.google.com/maps?saddr=start&daddr=end

어서 가서 한번 해봐. 시작과 끝 주소를 따옴표로 묶은 주소를 브라우저에 붙여 넣으십시오! 나는 출발 도시를 뉴 올리언스로 바꿨고 텍사스 주 휴스턴으로 끝났습니다. 그래서 Google Maps 길 찾기 URL은 다음과 같습니다.

http://maps.google.com/maps?saddr="new orleans, la "& daddr ="휴스턴, 텍사스 "

그것은 작동합니다! 보시다시피 Google지도는지도가 완전히로드되면 훨씬 복잡한 링크로 변환합니다. 이제 Google지도에 전달할 수있는 정상적인 URL이 생겼으므로 시작 주소와 도착 주소에 대한 두 개의 필드가있는 간단한 양식을 만들어야합니다..

사람들이 주소를 입력하고 목적지까지가는 길을 알기를 원한다면 두 번째 필드를 숨기고 목적지 주소로 이미 설정해야합니다..

시작 주소 입력 :

위의 코드를 확인하십시오. 첫 번째 행은 양식을 시작하고 제출 버튼을 클릭하면 데이터가 maps.google.com/maps로 전송되어야한다고 말합니다. 그만큼 목표 = 빈칸 결과가 새로운 창에서 열리 길 원합니다. 그런 다음 시작 주소에 대한 텍스트 상자가 비어 있습니다..

두 번째 텍스트 상자는 숨겨져 있고 값은 우리가 원하는 대상 주소입니다. 마지막으로 "Get Directions"라는 제목의 제출 버튼이 있습니다. 이제 누군가가 주소를 입력하면 다음과 같이 표시됩니다.

몇 가지 추가 매개 변수를 사용하여 길 찾기를 맞춤 설정하고지도를 추가 할 수 있습니다. 예를 들어 기본보기를지도로 사용하지 않고 대신보기를 원한다고 가정 해 봅시다. 위성 보여주기 교통.

http://maps.google.com/maps?saddr=%22new+orleans,+la%22&daddr=%22houston,+tx%22&ie=UTF8&t=h&z=7&layer=t

공지 사항 층 = t 과 t = h URL 필드 계층 = t는 트래픽 계층을 나타내고 t = h는 하이브리드 맵을 의미합니다.! 티 또한에 설정할 수 있습니다 엠 노멀 맵의 경우, 케이 위성 및 피 지형. 지 위의 URL에서 7로 설정되어 있습니다. 최종 URL에 붙여 넣기 만하면 사이트에 고도로 맞춤화 된 Google지도 길 찾기 양식이 생겼습니다.!

이 문제에 관해 의견이 있으시면 의견을 남기고 도와 드리겠습니다. 즐겨!