i-mobile
次へ下へ

Everyday Pieces ::

ありふれたカケラ::人生というジグソーパズルのピースたち

右クリックで標高表示な国土地理院のページ
電力使用状況&電気予報なブログパーツ(2)

鉄道なブログパーツ「どこかの駅」

プログラム / enchant.js, HTML5, ブログパーツ
公開日:2012年6月20日 / 更新日:2017年6月19日

★2017年6月19日追記。
またwikipediaのページの内容が変わったようで、
うまく動かなくなっていたようです。うむぅ・・・。
動くように改修しました。

★2017年4月14日追記。
wikipediaのページの内容が変わったようで、
うまく動かなくなっていたようです(^_^;)
動くように改修しました。

★2015年7月13日追記。
動作エラーが起きていました。
やり方を変えてどうにか動くようにしました。
サーバー側で何か設定が変わった?
セキュリティ関係?
残念ながら情報不足で原因不明です。
う〜む・・・(;´Д`)

★2014年1月3日追記。
@pagesがCloudFlareを導入したためか、なんか動かなくなっていたのを改善。
たぶん原因はここで書いてあるような感じっぽい・・・。

enchant.jsを利用して、
今度はアプリっぽいものを作ってみることにしました。

enchant.jsにはBox2Dのプラグインがあるので、
AS3版のBox2Dを利用して作ったFlashな「ロト6選択機」
移植しようかとも思ったのですが、
同じものを別な形式で作っても面白くないので、
その昔に思いついたアイデアを実現してみることにしました。

それは、
wikipediaの「日本の鉄道駅一覧」のページから
ランダムにどこかの駅の情報を取得して、
駅舎の写真とかを表示するというような感じです。
んで、
ブログパーツとして使えるようにサイズは小さめにして、
wikiやGoogleMapへのリンクを設けることにしました。
アプリの名前はずばり「どこかの駅」にしました(^_^;)

作業的には以下のような感じ。
XMLHttpRequestで該当ページを取得してresponseを解析。
必要な情報を収集して表示する。
ただしXMLHttpRequestはクロスドメインではうまくいかないので、
自前のプロクシを経由して回避しています。
プロクシについてはこちらを参考にさせていただきました。

実際にやってみると、
検索するDOMタグのパターンの見極めに苦労したりして、
ページの解析には結構手間取りました。
また概ねテンプレ通りに記述されているようなのですが、
微妙に異なる表記パターンがあるので調整も必要でした。
当初は隣接駅の情報も取


i-mobile
上へ次へ