８章のAJAX関連コードサンプルで利用されているYahooからの情報利用は、Yahooのサービス終了により行えないので、代わりにBusMap2が提供する山梨のバス情報に関するXML及びJSON形式データを使って演習をしよう。
http://richard.js.yamanashi.ac.jp/~toyoki/xoops222/modules/BusMap2/BusCategorizedRouteXml.php
にアクセスすると、バス路線とカテゴリのデータがXML形式で得られる。これを自分の練習用ディレクトリにセーブし、演習プログラムで読みだして、路線の一覧表をHTML形式で表示させてみる。
JSON形式のデータは、 http://richard.js.yamanashi.ac.jp/~toyoki/xoops222/modules/BusMap2/jsonp/BusCategorizedRouteJSON.php より得られる。（こちらのほうが、階層的構造になっており、上のXML形式データより洗練されている。）
これをセーブしてJSON形式データを取得して表形式に成形するプログラムを作ってみる。
上記URLでは、callback=のオプションをつけるとJSONPでの利用が可能である。 昨年書いた横山くん用説明ページ
http://richard.js.yamanashi.ac.jp/~toyoki/labTips/yokoyama2.html
及び、サンプルプログラムのフォルダ
http://richard.js.yamanashi.ac.jp/~toyoki/local_test/yokoyama/
の説明に則って、JSONPのデータ受け取りの練習をしてみよう。
将来、下のようなコードを読める・書けるようになることを期待する。 そのために、
https://developers.google.com/maps/documentation/javascript/reference?hl=ja にマニュアル(Reference)がある。
コードサンプルにある経路情報(Travel modes in directions)を日本の地図上で試してみたい。
http://www.w3schools.com/default.asp
jQueryとそのユーザインターフェイス用ライブラリjQuery-UIを利用して、バス運行日の入力を支援するクライアントスクリプト
基本運行スケージュールは、「毎日」、「平日のみ」、「土日・祝日のみ」のようなものだが、「土日と4/29-5/6,7/20-8/31」など特別な運行日のバスもある。路線・バスごとのデータをデータベースに格納したい。それを指定する管理者用ユーザインターフェイスが必要となる。
横山くんの卒論でのプログラムにちょっと手を加えたもの
(ソースコードは、ブラウザの機能を利用してみて欲しい）
バスコンシェルジュの乗り換え検索でよく検索数の集計データを地図上に表示した例 (加藤くんの卒論データよる)
jQuery, Google Maps API 及びjson形式データの受け渡し技術が用いられている。
ソースコードは以下にある。 http://richard.js.yamanashi.ac.jp/~toyoki/local_test/kato/