概要
東京公共交通オープンデータチャレンジに、応募してみた。
地下鉄モニター
写真
APIの調べ方。
jsonなので、まず、jqueryのgetjsonを試す。
クロスドメインで、だめ。
PHPで、取ろうとしたが、httpsで、取れない。
aptitudeで、php5-curl入れて取れた。
jsonなので、jsdoにファイルアップロードして、
jqueryのgetjsonで読んで、見れた。
d3.jsonで読んで、tableで、表示できた。
/api/v4/odpt:Station.json と /api/v4/odpt:Station の違いは、json付くと、フィルターが利かない、全部取れる。でかい。
odpt:Stationは、odpt.Station:TokyoMetroでフィルターかける。
駅名、路線、geo(緯度経度)取れる。
odpt:TrainTimetableは、odpt:trainNumberでフィルターかける
列車時刻表が取れる。
odpt:StationTimetableは、odpt:stationでフィルターかける。
駅時刻表が取れる。
バックエンドの構築。
jsdoのgetjsonで取れるように、phpでアローオリジンのヘッダーを入れる。
php5_curlで、読む。printで、吐く。
フロントエンドのUI決定。
候補は、react,vue,angularとriotですが、ピンとこない。
結果、d3とleafletとbootstrapに決定。
足りなかった技術。
d3で、テーブルをつくる。
leafletで、マーカーのアイコンと色。
jsdoで、クエリーストリングを受け取る。
leafletで、マーカークリックで、ページジャンプ。
以上、作った。
応募の手順
説明、ヘルプを書く。
マップを書く。
テーブルを書く。
写真を撮る。
ビデオを撮る。
開発者の皆様へ
今回、開発した、バックエンドのweb apiを提供致します。ご連絡、下さい。
成果物
http://jsrun.it/ohisama1/s99A
http://jsrun.it/ohisama1/aies
リンク
https://developer-tokyochallenge.odpt.org/?
以上。
