32
29

More than 3 years have passed since last update.

Google Maps URL 「現在地からのルート」のリンクを作る

Last updated at Posted at 2018-04-21

地図リンク

地域情報系のサイトでよくあるのが Google Maps へのリンク。
座標や施設名などのキーワードで簡単につくることができます。
施設の情報を表示しつつ、ユーザーは容易にルート検索を始める事ができます。

// 座標を使う場合
https://maps.google.co.jp/maps?q=${lat},${lng}&z=${zoom}
// 施設名などのキーワードを使う場合
https://maps.google.co.jp/maps?q=${keyword}&z=${zoom}

${hoge} の部分は変数です(以下同様)

例:京都駅の地図

現在地からのルート

一方、リンク先に 現在地からのルート を直接表示してほしいという依頼があったので調べてみました。
Google Maps URL を使って作る事ができます。

// 座標を使う場合
https://www.google.com/maps/dir/?api=1&destination=${lat},${lng}
// 施設名などのキーワードを使う場合
https://www.google.com/maps/dir/?api=1&destination=${keyword}

例:現在地から京都駅へのルート

※現在地として表示される場所はGPSが有効な場合はほぼ正確ですが、PCなどGPSを使用しない場合は推定位置です。位置情報の推定方法についてはGoogle 検索 ヘルプに記事がありますのでご覧ください。

出発地から現在地へのルート

また、出発地が固定されている場合(駅からの案内など)は、以下のようになります。

// 座標を使う場合
https://www.google.com/maps/dir/?api=1&origin=${lat},${lng}&destination=${lat},${lng}
// 施設名などのキーワードを使う場合
https://www.google.com/maps/dir/?api=1&origin=${keyword}&destination=${keyword}

例:京都駅から京都タワーへのルート

参考

Google Maps APIs - Maps URLs - Overview - Forming the Directions URL
https://developers.google.com/maps/documentation/urls/guide#directions-action

32
29
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
32
29