経路地図API
【重要】常時SSL(AOSSL)対応にともないリクエストURLが変更されています。詳しくはこちらをご確認ください。目次
- 概要
- 説明
- リクエストパラメーター一覧
- レスポンス
- サンプルレスポンス
- エラー
経路地図APIでできること
出発地から目的地までの最適なルート案内図を生成でき、ウェブページに自由にはり付けて利用できます。
経路地図APIの主な機能は以下となります。
-
2点以上の地点を指定すると自動的に経路探索され、ルート案内図が生成されます。
短距離の場合は徒歩用のデータ、長距離の場合は車用のデータを参照して経路探索されます。 - 経路を複数指定できます。
- マーカー(ピンアイコン)、フリーテキストをルート案内図に追加できます。
- 経路地図APIが出力する地図は静的な画像ですので、JavaScriptの実行環境は必要ありません。
経路地図の表示方法
imgタグのsrcにリクエストURLをセットして、地図を表示します。
サンプルコード
下記のコードをページにはり付けて地図を表示できます。
<img width="200" height="200" src="https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.68233286004894,139.76649043148458,35.685173782469064,139.76584670132092|color:0000ffff&width=200&height=200
地図の説明
![]() |
|
経路地図を表示する
経路地図を表示するにはrouteパラメーターに2点以上の緯度経度を指定します。
縮尺は経路の位置と出力する画像の大きさにより自動的に決定されます。
経路を指定する
route
パラメーターに表示したい経路の緯度経度列を指定します。
3点以上指定すると間の点は経由点として検索されます。
表示例:東京駅から二重橋前駅を経由して有楽町駅へ
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.682019132352565,139.76655480450057,35.68020645928568,139.76149079388048,35.67574431937614,139.7633790690269&width=200&height=200

複数の経路を指定する
route
パラメーターを複数指定することで複数の経路を描画できます。
表示例:東京駅から有楽町駅までの、二重橋前駅を経由するルート(青色)としないルート(緑色)
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.682019132352565,139.76655480450057,35.68020645928568,139.76149079388048,35.67574431937614,139.7633790690269&route=35.68208884972506,139.76655480450057,35.67574431937614,139.7633790690269|search:on|color:00ff0064&width=200&height=200

経路の表示をカスタマイズする
経路は属性指定することで表示をカスタマイズできます。
以下の属性が指定できます。
属性名 | 値 | 説明 |
---|---|---|
search | string on(デフォルト), off |
指定された緯度経度列を経路探索するかどうかを指定します。 on(検索する)またはoff(検索しない)で指定できます。 |
width | integer 7(デフォルト) |
経路の線の幅を指定します。 |
color | string 0000ff64(デフォルト) |
経路の線の色を指定します。 RGBAを4桁または8桁の16進数字で指定します。 |
start | string on(デフォルト), off |
出発地点にマーカーを描画するかどうかを指定します。 on(表示)またはoff(非表示)で指定できます。 |
goal | string on(デフォルト), off |
到着地点にマーカーを描画するかどうかを指定します。 on(表示)またはoff(非表示)で指定できます。 |
表示例:線の色を「ff000080」、線の幅を「12」、出発地点のマーカーを非表示、到着地点のマーカーを表示、経路探索ありで指定する。
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.682411291780156,139.7664046007963,35.68084264250379,139.76116892879924,35.67568331182786,139.76331469601115|start:off|width:12|color:ff000080|search:on&width=200&height=200

画像サイズを指定する
地図画像のサイズをwidth
(幅)、height
(高さ)のパラメーターで指定します。
パラメーター名 | 値 | 説明 |
---|---|---|
width | integer 256(デフォルト), 2000(最大) |
画像サイズの幅。(単位:pixel) |
height | integer 256(デフォルト), 2000(最大) |
画像サイズの高さ。(単位:pixel) |
width
、height
を指定しない場合は、幅256pixel、高さ256pixelとなります。
マーカーを表示する
経路地図にマーカーを追加表示することができます。
マーカーを追加する
マーカーを追加するにはpin
パラメーターにマーカーを表示したい地点の緯度経度を指定します。
表示例:マーカーを1個表示する。
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&pin=35.66536364981621,139.7315627056929&width=200&height=200

複数のマーカーを追加する
pin
パラメーターを複数指定することで複数のマーカーを表示できます。
表示例:マーカーを2個表示する。
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&pin=35.66536364981621,139.7315627056929&pin=35.665721025276625,139.731047721562&width=200&height=200

マーカーの表示をカスタマイズする
マーカーは属性指定することで表示をカスタマイズできます。
以下の属性が指定できます。
属性名 | 値 | 説明 |
---|---|---|
type | string | マーカーの種類を指定します。 数字(0~99)、英字(a~z)、星マーク(default)、または小さなマーカー(指定なし)から選択できます。 |
color | string red(デフォルト), blue, green, yellow |
マーカーの色を指定します。 赤(red)、青(blue)、緑(green)、黄(yellow)から選択できます。 |
dx | integer 0(デフォルト) |
マーカーの横位置を修正します。 右正方向で指定されたpixel数分横に移動します。 |
dy | integer 0(デフォルト) |
マーカーの縦位置を修正します。 下正方向で指定されたpixel数分縦に移動します。 |
表示例:いろいろなアイコンを表示する。
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&pin=35.665825622669935,139.73142323082408|type:default|color:blue|dx:10|dy:10&pin=35.66572974173151,139.731047721562|type:a|color:green&pin=35.66547696415998,139.73079022949662|color:yellow&pin=35.66535057507404,139.73142323082396|type:99&width=200&height=200

テキストを表示する
経路地図にテキストを追加表示することができます。
テキストを追加する
テキストを追加するにはtext
パラメーターにテキストを表示したい地点の緯度経度と、label属性に表示したいテキストを指定します。
labelに指定するテキストはUTF-8でエンコードしてください。
表示例:テキスト「フリーテキスト」を1個表示する。
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&text=35.665433381739135,139.73147687500435|label:%e3%83%95%e3%83%aa%e3%83%bc%e3%83%86%e3%82%ad%e3%82%b9%e3%83%88&width=200&height=200

複数のテキストを追加する
text
パラメーターを複数指定することで複数のテキストを表示できます。
表示例:テキスト「フリーテキスト」を2個表示する。
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&text=35.665433381739135,139.73147687500435|label:%e3%83%95%e3%83%aa%e3%83%bc%e3%83%86%e3%82%ad%e3%82%b9%e3%83%88&text=35.66503678061642,139.7318201977582|label:%E3%83%95%E3%83%AA%E3%83%BC%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88&width=200&height=200

テキストの表示をカスタマイズする
テキストは属性指定することで表示をカスタマイズできます。
以下の属性が指定できます。
属性名 | 値 | 説明 |
---|---|---|
color | string 323232ff(デフォルト) |
テキストの色を指定します。 RGBAを4桁または8桁の16進数字で指定します。 |
width | integer 12(デフォルト) |
文字の大きさを指定します。 |
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&text=35.665433381739135,139.73147687500435|label:%e3%83%95%e3%83%aa%e3%83%bc%e3%83%86%e3%82%ad%e3%82%b9%e3%83%88|color:000000ff|width:15&text=35.66503678061642,139.7318201977582|label:%E3%83%95%E3%83%AA%E3%83%BC%E3%83%86%E3%82%AD%E3%82%B9%E3%83%88|color:ff0000ff|width:20&width=200&height=200

地図のスタイルを変更する
style
パラメーターに地図のスタイルを指定することで、地図のスタイルを変更できます。
表示例:standard
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&width=200&height=200&style=base:standard

表示例:classic
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&width=200&height=200&style=base:classic

表示例:grayish
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&width=200&height=200&style=base:grayish

表示例:simple
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.666104548381654,139.73185774868438,35.66471862664352,139.73139640873367&width=200&height=200&style=base:simple

リクエストパラメーター一覧
「RESTリクエストの構築(GET)」をご参照ください。
パラメーター | 値 | 説明 | |||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
appid(必須) | string | アプリケーションID。詳細はこちらをご覧ください。 | |||||||||||||||||||||
route(必須) | string |
経路の指定を行います。 フォーマットは【属性:値】で記述してください。 各項目は「|(パイプ)」でつなげてください。 routeを複数指定することも可能です。
|
|||||||||||||||||||||
pin | string |
マーカーを描画します。 フォーマットは【属性:値】で記述してください。 各項目は「|(パイプ)」でつなげてください。 pinを複数指定することも可能です。
|
|||||||||||||||||||||
text | string |
テキストを描画します。 フォーマットは【属性:値】で記述してください。 各項目は「|(パイプ)」でつなげてください。 textを複数指定することも可能です。
|
|||||||||||||||||||||
width |
integer 256(デフォルト), 2000(最大) |
画像サイズの幅。(単位:pixel) | |||||||||||||||||||||
height |
integer 256(デフォルト), 2000(最大) |
画像サイズの高さ。(単位:pixel) | |||||||||||||||||||||
output | string png(デフォルト), png32, gif, jpg, jpeg |
出力形式。
|
|||||||||||||||||||||
style | string | 地図のスタイルを変更します。 スタイルを変更することで表示される地図のスタイルを変更できます。 下記のスタイルが選択可能です。
指定がない場合、デフォルトとしてstandardのスタイルで表示されます。 |
API使用上の注意
出発地点のマーカー、到着地点のマーカー、pinで指定したマーカーと、地図の注記に指定したテキストが重なった場合は、注記が非表示になります。
URLの最大の長さは2048バイトです。
URLエンコードして指定するパラメーターもありますが、エンコード後のURLの長さが2048バイトを超えないようにしてください。マーカーとテキストは合計100個まで指定できます。
経路は20kmまでの長さで指定してください。
サンプルリクエストURL
東京ミッドタウンから六本木駅までの経路地図を表示
https://map.yahooapis.jp/course/V1/routeMap?appid=<あなたのアプリケーションID>&route=35.6659127870595,139.7308921534391,35.6631583463388,139.731235476193&width=200&height=200
レスポンス
指定された出力形式(output=png,png32,gif,jpg,jpeg)の地図画像を返します。