HTML5でOpenData
を や って み る

2013.1.24 第3回 Linked Open Data ハッカソン関西
Bathtimefish 村岡 正和
むらおか まさかず

村岡正和
@bathtimefish
Webアプリケーション開発 IT業務システム設計/開発
Webサービス導入/事業戦略コンサルティング
HTML5-WEST.jp代表 / html5j マークアップ部 部長 / HTML...
Firefox OSの薄い本書きました。

コミックマーケット85
3日目
にて配布!

http://goo.gl/WeyvOl
監修しました。

実例ごとの実装例がたくさん書いてあ
ります。ウェブサイト制作やCMSの運
用時に便利です。

好評販売中!!
HTML5
RichでOpenなWebアプリケーションが
作成できる。
OpenData
http://linkeddata.org/
http://5stardata.info/
( ́ー`)y-

ワカンネ
難しい理屈はわからんけど、
オープンなのはわかった
HTML5でデータを取ってみた。
横浜市立博物館施設一覧のLODを取得する
http://fp.yafjp.org/yokohama_art_lod/place_rdf
と、その前に
orz
ハマったこと。。。
XHRで取得する際にSame Origin Policyにひっかかる。
横浜美術館のRDFをXHRで取得しようと思ったけどできなかった。

HTML5 RIAでOpenDataを利用する際には致命的かも。
OpenData界隈ではCORSはどう...
調べまくったあげく、
SPARQL
http://ja.wikipedia.org/wiki/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のデモとしてダメダメなのはわかってますw
Demo
https://github.com/mirlord/jquery-csv
http://goo.gl/hI9VhN
appendix
XHRなどのコールバック処理をわかりやすく記述しよう

function() {
callback( function() {
callback( function() {
callback( function () {
callback( f...
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利用がいいのかも

データのパースは簡単だった。
jQue...
いろんなアイデアをOpen WebAppに。

Happy Hacking :-)
Thanks !
Html5でOpen Dataをやってみる
Html5でOpen Dataをやってみる
Html5でOpen Dataをやってみる
Html5でOpen Dataをやってみる
Upcoming SlideShare
Loading in …5
×

Html5でOpen Dataをやってみる

1,054 views

Published on

Published in: Technology
0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,054
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
9
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

Html5でOpen Dataをやってみる

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

×