自分プロジェクトで関東地方の鉄道運行情報を一覧できるサイトを作りました。

<a href="http://110chang.com/traininfo/">関東地方鉄道運行情報</a>（試験中）



<a href="http://110chang.com/traininfo/"><img class="alignnone" src="https://farm8.staticflickr.com/7228/7393236444_d748bdd17c.jpg" alt="" width="500" height="347" /></a>

# 着想

昨年の震災や台風などで「帰宅困難者」が問題となる⇒今、どの路線がやばいのか一目で把握できたらいいかも

# 制作開始

当初は、1路線だけに限定して各駅の緯度経度を取得して「運転見合わせ範囲」も含めて視覚化ものを作った。一応形にはなったが、やはり全体を見れないとしょぼいのでなかったことに。欲張りすぎた。

この時点では情報源としてついったーを考えていました。

ついったーの運行情報をつぶやくアカウントからツイートを取得してごにょごにょすれば更新情報が取得できるのではないか。

しかし、つぶやきをいくつ取得すれば関東を網羅できるのかいまひとつ掴めず、フロント技術だけで数百のつぶやきから情報を抽出するのも無駄に複雑なことをしているようでやめました。

# 第２段階

さて、「関東の運行情報を一目でなんとなく把握できる」という当初の目標に立ち返り、まずは一覧的なものを作成する事にしました。ただの一覧なら簡単にできるはず・・

また、情報源もいろいろ検索して探しました。

* <a href="http://feed-media.com/doumei/feed/http%3A%252F%252Ftraffic-info.mydns.jp%252Frss%252Fkantou.rdf">関東鉄道運行情報RSS</a></li>

なぞのRSSサイト。元ネタはgoo路線。渡りに舟というやつで。
ここの情報を元にほぼ完成まで漕ぎ着けるが、5/1で更新が停止してしまった・・さあ困った
Yahoo!路線をライブドアのPage2Feedというサービスでフィード化するとかいろいろ考えた

最終的に

**goo路線をYahoo! PipesでFetchしてjsonを吐かせる。**

という方法で落ち着く

<a href="http://pipes.yahoo.com/pipes/">Yahoo! Pipes</a>は数年前話題になった、いろんな所のフィードを編集して自分好みにして配信できるみたいな、米Yahoo!のサービス。米Yahoo!なんかやばいっぽいけどPipesは無くならないでほしいなー＞＜（切実）

運行情報はいろいろなサイトがありますが、１画面で詳細まで把握できる所はgoo路線しかなかった。だれか路線情報RSSで配信してください喜んで使いますです。

# 調整から公開

おおまかに出来てから約１ヶ月、正しく反映してるか様子を見ました。だいたい正しく表示できるようになったのでデザイン調整を行い公開することにしました。

goo路線の路線名を把握したいのだけど事故の少ない路線はぜんぜんチェックできないし、一覧の路線名とも若干違ったりするのでまだ全部はチェックできてない（特に下の方）

反映されていない路線があったらgoo路線での表示名とともに教えてもらえるとうれしいです。

勉強のためもあるのでHTML5+CSS3に対応してないIEとかIEとかIEでは見れないです。

せめてIE9は対応しようと思ったけどPipesのJSON読み込めない。“No Transport”というエラーが出て、<code>$.support.cors</code>（Cross Domain Resource Sharing）が<code>true</code>でないとだめとかで無理矢理<code>true</code>にするとアクセスが拒否される。（たまに他のブラウザでもでるんだよな・・）

<a href="http://log.nissuk.info/2011/07/wsh-jquery-162.html">WSH: jQuery 1.6.2を使用する - “クロスドメイン通信と見なされている状態でCORS(Cross Orign Resource Sharing)が有効でない場合jQuery.ajax()が"No Transport"エラーになる </a>”

Archive for 2012.06

「関東地方鉄道運行情報」を作成しました。