駅すぱあと API HTML5インターフェースサンプル

「駅すぱあと API」を利用したサンプルコードです。

ソースコードや画像は自由に改変できますので、是非ご利用ください。
なお、サンプルとしてのご提供のため、動作保証やお問い合わせ等のサポートは承っておりません。
ご利用にあたりユーザーズガイドをご用意しておりますので、ご参照ください。

サンプルコードへのご意見・ご要望につきましては、GitHubのIssueへ投稿いただけますと幸いです。
今後のサンプルご提供にあたり参考とさせていただきます。

ダウンロードしたファイルの利用方法

ダウンロードしたファイルを展開し、表示するサーバーへ設置してください。

なお、表示するページごとにJavaScriptをインクルードする必要があります。

インクルードは下記使用例を参考に記述してください。

【使用例1】jsファイルをルートに設置した場合

<script type="text/javascript" src="コンポーネント名.js?key=YOUR_ACCESS_KEY" charset="UTF-8"></script>

【使用例2】ディレクトリ構成を残した場合

<script type="text/javascript" src="コンポーネント名/コンポーネント名.js?key=YOUR_ACCESS_KEY" charset="UTF-8"></script>

※ YOUR_ACCESS_KEY の部分には、「駅すぱあと API」のアクセスキーを記述します。

※ コンポーネントのご利用にはアクセスキーが必要になります。アクセスキーはサービス契約時に弊社より送付されます。

また、下記のパーツをご利用の場合はCSSファイルのインクルードも必要になります。

• 日付入力パーツ
• 駅名入力パーツ
• 探索条件パーツ
• 経路表示パーツ
• 駅時刻表パーツ
• 区間時刻表パーツ
• 列車時刻表パーツ
• 定期払戻計算パーツ
• 路線図パーツ

インクルードは下記使用例のいずれかを三項に記述してください。

【使用例1】expCssをルートに設置した場合

<link class="css" rel="stylesheet" type="text/css" href="expCss/コンポーネント名.css">

【使用例2】ディレクトリ構成を残した場合

<link class="css" rel="stylesheet" type="text/css" href="コンポーネント名/expCss/コンポーネント名.css">

サンプルコード

Wikiにてリファレンスやサンプルなどをご用意しております。

推奨環境

OS	バージョン	ブラウザ	備考
Windows	10	Microsoft Edge	最新版を推奨
MacOSX	10.7以降	Safari	最新版を推奨
Windows/Mac	-	FireFox	最新版を推奨
Windows/Mac	-	Chrome	最新版を推奨
iOS	11.0以降	Safari
Android	6.0以降	Chrome

※ IE11は非推奨です。

デモ

画面サンプル

経路探索	サンプルを確認
鉄道駅の時刻表	サンプルを確認
区間の時刻表	サンプルを確認
鉄道駅時刻表の列車情報	サンプルを確認
定期代の払い戻し計算	サンプルを確認
定期代/運賃の分割計算	サンプルを確認
経路を利用した時刻表表示	サンプルを確認
回数券を利用した経路探索	サンプルを確認
ランドマークを利用した経路探索	サンプルを確認

データ取得サンプル

駅情報の取得	サンプルを確認
路線情報の取得	サンプルを確認
範囲探索	サンプルを確認
回数券情報の表示	サンプルを確認

路線図

路線図表示サンプル	サンプルを確認
路線図イベント設定サンプル	サンプルを確認
路線図駅クリック設定サンプル	サンプルを確認
路線図サイズ調整サンプル	サンプルを確認
路線図アプリケーションの実例サンプル	サンプルを確認

駅すぱあとの情報

データバージョンの取得	サンプルを確認

拡張ツール

JSON/XML変換	サンプルを確認