
|
4.路線図を表示 今回もHeartRails ExpressとGoogleMapを組み合わせます。
1.フォーム画面
戻る
HeartRails ExpressAPIを利用して、 「都道府県名」「路線名」の コンボボックスを設置します、 「都道府県名」と「路線名」だけのコンボボックスは提供されてなかったので、 HeartRails ExpressのAPIを利用して作成しました。 情報の取得処理は、PHPを用いて行います。 リクエストを送信して、JSONを受け取るだけですけどね。 Json形式なので、PHPでデータの加工は行わないで、 JavaScript側で行いました。 あとは、検索ボタンを配置して、路線名を元にGoogleMapを表示します。 2.検索ボタンの処理 路線名からHeartRails Expressを利用して、駅情報を取得します。 路線に属する駅情報をすべて取得することができます。 緯度、経度情報も取得できます。 駅一覧情報を元に、GoogleMapを作成します。 駅毎にマーカーを作成して、マーカーをクリックしたら、 駅名が表示されるようにイベントを設けます。 また、駅と駅を結ぶ線を表示します。 方法などは、Ajaxを参考。 3.完成 動くことを確認します。 路線図をGoogleMapで表示 4.課題 面白いとは思いましたが、使い道が??? 当然ながらエラー処理は考慮に入れていませんし、 あと、クライアントの負荷とかどうなんだろう??? |
|