WebAPI Document - GUIソリューション - チュートリアル

列車の停車駅、および、発時間の一覧を表示します。 なお、駅によっては着時間も表示されます。 また、時刻表のlineCodeが必要です。

インクルード

<script type="text/javascript" src="expGuiTrainTimeTable.js?key=keycode"></script>
<link class="css" rel="stylesheet" type="text/css" href="expCss/expGuiTrainTimeTable.css">

サンプルコード

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
    <title>
    Webサービスサンプル
    </title>
    <link class="css" rel="stylesheet" type="text/css" href="expCss/expGuiTrainTimeTable.css">
    <link class="css" rel="stylesheet" type="text/css" href="expCss/expGuiStationTimeTable.css">
    <script type="text/javascript" src="expGuiTrainTimeTable.js?key=keycode">
    </script>
    <script type="text/javascript" src="expGuiStationTimeTable.js?key=keycode">
    </script>
    <script type="text/javascript">
      <!--
var trainTimeTable;// 駅時刻表パーツ
var stationTimetable;// 列車時刻表パーツ
/*
 * パーツを初期化
 */
function init(){
  // 列車時刻表
  trainTimeTable = new expGuiTrainTimeTable(document.getElementById("trainTimetable"))
  // 駅時刻表の出力
  stationTimetable = new expGuiStationTimeTable(document.getElementById("stationTimetable"));
  stationTimetable.bind("click",viewTrainTimeTable);
  stationTimetable.dispStationTimetable("高円寺",1,resultTimeTable);
}
/*
 * 時刻表取得時のコールバック関数
 */
function resultTimeTable(isSuccess){
  if(!isSuccess){
    alert("時刻表が取得できませんでした");
  }
}
/*
 * 時刻表をクリックした際のイベント
 */
function viewTrainTimeTable(lineCode){
  var tmpLineObject = stationTimetable.getTimeTableObject(lineCode);
  if(typeof tmpLineObject != 'undefined'){
    trainTimeTable.dispStationTrainTimetable(lineCode);
  }
}
// -->
    </script>
  </head>
  <body onLoad="Javascript:init();">
    <div id="stationTimetable">
    </div>
    <div id="trainTimetable">
    </div>
  </body>
</html>
チュートリアルへ戻る
Val Laboratory