1. HTML5でOpenData
を や って み る
2013.1.24 第3回 Linked Open Data ハッカソン関西
Bathtimefish 村岡 正和

2. むらおか まさかず
村岡正和
@bathtimefish
Webアプリケーション開発 IT業務システム設計/開発
Webサービス導入/事業戦略コンサルティング
HTML5-WEST.jp代表 / html5j マークアップ部 部長 / HTML5 Experts.jp メンバー
GDG京都 / CSS Nite in OSAKA / 神戸ITフェスティバル実行委員など
HTML5-WEST.jp

3. Firefox OSの薄い本書きました。
コミックマーケット85
3日目
にて配布！
http://goo.gl/WeyvOl

4. 監修しました。
実例ごとの実装例がたくさん書いてあ
ります。ウェブサイト制作やCMSの運
用時に便利です。
好評販売中！！

5. HTML5

8. RichでOpenなWebアプリケーションが
作成できる。

9. OpenData

10. http://linkeddata.org/

11. http://5stardata.info/

12. ( ́ー｀)y-
ﾜｶﾝﾈ

13. 難しい理屈はわからんけど、
オープンなのはわかった

14. HTML5でデータを取ってみた。

15. 横浜市立博物館施設一覧のLODを取得する

16. http://fp.yafjp.org/yokohama_art_lod/place_rdf

17. と、その前に

18. orz
ハマったこと。。。

19. XHRで取得する際にSame Origin Policyにひっかかる。
横浜美術館のRDFをXHRで取得しようと思ったけどできなかった。
HTML5 RIAでOpenDataを利用する際には致命的かも。
OpenData界隈ではCORSはどう考えられてるんだろうか？
詳しい人おしえてください。

20. 調べまくったあげく、

21. SPARQL
http://ja.wikipedia.org/wiki/SPARQL

22. http://lod.ac/wiki/SPARQL%E3%82%B9%E3%83%8B%E3%83%9A%E3%83%83%E3%83%88

23. https://github.com/jgeldart/jquery-sparql

24. Demo

26. 大阪市施設情報CSVを取得する

27. http://www.city.osaka.lg.jp/toshikeikaku/page/0000250227.html

28. と、その前に

29. やっぱりとれなかった orz
CSVのパースがやりたかったのでデータをSame Originにコピーした。。。
OpenDataのデモとしてダメダメなのはわかってますｗ

30. Demo

31. https://github.com/mirlord/jquery-csv

33. http://goo.gl/hI9VhN

34. appendix

35. XHRなどのコールバック処理をわかりやすく記述しよう
function() {
callback( function() {
callback( function() {
callback( function () {
callback( function () {
callback( function () {

36. https://api.jquery.com/jQuery.ajax/

37. https://api.jquery.com/jQuery.when/

38. http://wiki.commonjs.org/wiki/Promises/A

39. http://www.slideshare.net/bathtimefish/async-flow-controll-basic-and-practice

40. まとめ
HTML5 Webapp開発的にはSame Origin
Policyが痛い。
ServerSide Programで取得か、PackagedAppか？
RDFならSPARQL利用がいいのかも
データのパースは簡単だった。
jQueryマンセー！

41. いろんなアイデアをOpen WebAppに。
Happy Hacking :-)

42. Thanks !