html5でopen dataをやってみる
DESCRIPTION
TRANSCRIPT
HTML5でOpenDa t aをやってみる
2013.1.24 第3回 Linked Open Data ハッカソン関西Bathtimefish 村岡 正和
HTML5-WEST.jp代表 / html5j マークアップ部 部長 / HTML5 Experts.jp メンバーGDG京都 / CSS Nite in OSAKA / 神戸ITフェスティバル実行委員など
むらおか まさかず
村岡正和
HTML5-WEST.jp
Webアプリケーション開発 IT業務システム設計/開発Webサービス導入/事業戦略コンサルティング
@bathtimefish
コミックマーケット85
Firefox OSの薄い本書きました。
3日目
にて配布！
http://goo.gl/WeyvOl
監修しました。
実例ごとの実装例がたくさん書いてあります。ウェブサイト制作やCMSの運用時に便利です。
好評販売中！！
HTML5
RichでOpenなWebアプリケーションが作成できる。
OpenData
( ́ー｀)y-~~ ﾜｶﾝﾈ
難しい理屈はわからんけど、オープンなのはわかった
HTML5でデータを取ってみた。
横浜市立博物館施設一覧のLODを取得する
http://fp.yafjp.org/yokohama_art_lod/place_rdf
と、その前に
ハマったこと。。。orz
XHRで取得する際にSame Origin Policyにひっかかる。
HTML5 RIAでOpenDataを利用する際には致命的かも。
OpenData界隈ではCORSはどう考えられてるんだろうか？
詳しい人おしえてください。
横浜美術館のRDFをXHRで取得しようと思ったけどできなかった。
調べまくったあげく、
http://ja.wikipedia.org/wiki/SPARQL
SPARQL
http://lod.ac/wiki/SPARQL%E3%82%B9%E3%83%8B%E3%83%9A%E3%83%83%E3%83%88
https://github.com/jgeldart/jquery-sparql
Demo
大阪市施設情報CSVを取得する
http://www.city.osaka.lg.jp/toshikeikaku/page/0000250227.html
と、その前に
やっぱりとれなかった orz
CSVのパースがやりたかったのでデータをSame Originにコピーした。。。
OpenDataのデモとしてダメダメなのはわかってますｗ
Demo
https://github.com/mirlord/jquery-csv
appendix
XHRなどのコールバック処理をわかりやすく記述しよう
function() { callback( function() { callback( function() { callback( function () { callback( function () { callback( function () { callback( function () { callback( function () { callback( function () { callback( function () {
https://api.jquery.com/jQuery.ajax/
https://api.jquery.com/jQuery.when/
http://wiki.commonjs.org/wiki/Promises/A
http://www.slideshare.net/bathtimefish/async-flow-controll-basic-and-practice
まとめ
HTML5 Webapp開発的にはSame Origin Policyが痛い。
ServerSide Programで取得か、PackagedAppか？
RDFならSPARQL利用がいいのかも
データのパースは簡単だった。
jQueryマンセー！
いろんなアイデアをOpen WebAppに。
Happy Hacking :-)
Thanks !