ハンズオンWordPressとLODビジュアライズプラグイン“WP Sgv”

44
ハンズオン WordPressLODビジュアライズプラグイン WP Sgv特定非営利活動法人リンクト・オープン・データ・イニシアティブ 上田 洋 WordBench京都10月号 WordPress × オープンデータ × データビジュアライゼーションハンズオン会 2015.10.03

Transcript of ハンズオンWordPressとLODビジュアライズプラグイン“WP Sgv”

ハンズオン

WordPressとLODビジュアライズプラグイン

“WP Sgv”

特定非営利活動法人リンクト・オープン・データ・イニシアティブ

上田洋

WordBench京都10月号WordPress ×オープンデータ×データビジュアライゼーションハンズオン会

2015.10.03

今日使う資料・プログラムはhttp://uedayou.net/

のGitHub・Gist・SlideShareにあります

ハンズオンに必要なもの

1. WordPressを設置するPC

2. WordPressを編集するPC(1と同じPCでもOK)

3. WordPress

4. WP Sgv (WordPressプラグイン)

• 本家ではなく、今日のためにカスタマイズしたものを利用

• https://github.com/uedayou/wp-sgv

WP Sgvとは?

•合同会社緑IT事務所が開発したSPARQLを使用するビジュアライズツールSgvizlerのショートコードを発行できるWordPressプラグイン

•公式サイト:http://midoriit.com/works/wp-sgv.html

•今回はハンズオン用に改修したプラグインを利用します。

• ダウンロード先:https://github.com/uedayou/wp-sgv

一式Zipファイルとしてダウンロードできます

WP Sgvインストール

• 「wp-sgv-master.zip」を解凍

• 「wp-sgv-master」フォルダを

「[WordPressフォルダ]/wp-content/plugins」にコピー

WP Sgvインストール

• WordPressの管理ページの「プラグイン」タブを開き「WP Sgv」が表示されていることを確認

WP Sgvでビジュアライズするには?

1. SPARQLクエリを書く

2. 「SPARQL可視化ショートコード」作成フォームにSPARQL

クエリや図表の設定を指定する

3. 「ショートコード」作成ボタンを押してショートコード作成

4. ショートコードをコピーして、記事内にペースト

5. プレビューで記事を確認

今日はSPARQLクエリを書きません!

SPARQLとは?

• RDF(LOD)用の汎用クエリ言語

• RDF(LOD)用のデータベースからトリプル(3つ組)データを検索して、表形式でデータが取得できます

PREFIX rdfs: <http://www.w3.org/2000/01/rdf-schema#>

SELECT * WHERE {?uri rdfs:label ?label .

}LIMIT 10

?uri ?label

http://ja.dbpedia.org/resource/岩手県 "岩手県"

http://ja.dbpedia.org/resource/石川県 "石川県"

http://ja.dbpedia.org/resource/愛媛県 "愛媛県"

http://ja.dbpedia.org/resource/岡山県 "岡山県"

じゃあどうするの?

• SPARQLクエリ作成支援ツールを使います!

SPARQL Creator

SPARQL Creatorとは?

•中部大学年岡研究室開発のSPARQLクエリ作成支

援ツール

• SPARQLエンドポイント(SPARQLクエリで検索できる

Web API)の指定と、簡単なマウス操作でSPARQLク

エリが簡単に作成可能

•検索されるデータのプレビューが画面中央の表に

常に表示される

• LODチャレンジ2014 基盤技術部門優秀賞受賞

SPARQL Creator

•今日は公式のものではなく、ハンズオン用に改修した「SPARQL Creator(uedayou改) 」を利用します。

• http://uedayou.net/SPARQLCreator/

SPARQL Creatorの使い方

1. SPARQLエンドポイントのURLを入力

2. 「クラス」メニューより興味のある項目を一つチェック

3. 「編集ツール」メニューのリストより面白そうな項目をチェック(複数選択可)

4. 画面中央に表示される検索結果サマリーを確認

5. 「SPARQL Query」テキストエリアの文字列(SPARQLクエリ)をコピーして利用※4のサマリーのデータが検索できます

とても簡単にSPARQLクエリを作れます!

(1) SPARQLエンドポイントのURLを入力

クリック!

(2) 「クラス」メニューより項目を一つチェック

(3) 「編集ツール」メニューのリストより項目をチェック

(1) “type”, “comment”のチェックをはずす(2) “birthDate”, “コンビ名”, “出身地”にチェックをいれる

(4)検索結果サマリーを確認

(5) SPARQLクエリ完成

コピー

select ?label ?birthDate ?p1 ?p13 where{?s a <http://dbpedia.org/ontology/Comedian>.?s <http://www.w3.org/2000/01/rdf-schema#label> ?label.?s<http://dbpedia.org/ontology/birthDate> ?birthDate.?s <http://ja.dbpedia.org/property/コンビ名> ?p1.?s <http://ja.dbpedia.org/property/出身地> ?p13.}limit 100

“SPARQL Creator”と

“WP Sgv”を使ったビジュアライズ

SPARQL Creator x WP Sgv

1. SPARQL Creator で SPARQLクエリを作る

2. SPARQLクエリを一部書き換える

3. WordPressのWP Sgvショートコード作成フォーム

にSPARQLクエリを入力

4. WP Sgvにグラフの種類などを設定する

5. ショートコードを作成してWordPressに貼り付ける

(1) SPARQL Creator で SPARQLクエリを作る

(1)全てチェックをはずす(2) “birthPlace”だけ、チェックをいれる

チェックを入れるのは一つだけに!

(2) SPARQLクエリを一部書き換えるコピー

select ?birthPlace where{?s a <http://dbpedia.org/ontology/Comedian>.?s <http://dbpedia.org/ontology/birthPlace> ?birthPlace.}limit 100

select ?birthPlace (count(?s) as ?num) where{?s a <http://dbpedia.org/ontology/Comedian>.?s <http://dbpedia.org/ontology/birthPlace> ?birthPlace.}group by ?birthPlace ORDER BY DESC(?num) limit 10

(1) “?birthPlace” と “where”の間に (count(?s) as ?num) を挿入

(2) “limit 100” を “group by ?birthPlace ORDER BY DESC(?num) limit 10”

に置換

(3) WordPressのWP Sgvショートコード作成フォームにSPARQLクエリを入力

縦棒グラフ

(4) WP Sgvにグラフの種類などを設定する•今日は、円グラフと棒グラフを作成してみましょう!

横棒グラフ

円グラフ

今はこれを!

(5)ショートコードを作成してWordPressに貼り付ける

クリック!コピー

ペースト

完成!

クリック!

完成したけど・・・

URLみたいになっててかっこ悪い… SPARQLクエリ少し書き換えるだけでスッキリ!

どうやったか?

select ?birthPlace (count(?s) as ?num) where{?s a <http://dbpedia.org/ontology/Comedian>.?s <http://dbpedia.org/ontology/birthPlace> ?Place.?Place rdfs:label ?birthPlace.}group by ?birthPlace ORDER BY DESC(?num) limit 10

とか

select ?birthPlace (count(?s) as ?num) where{?s a <http://dbpedia.org/ontology/Comedian>.?s <http://dbpedia.org/ontology/birthPlace> ?Place.bind( substr(str(?Place), 32) as ?birthPlace) }group by ?birthPlace ORDER BY DESC(?num) limit 10

SPARQLを少し勉強すればいろんなことができます!

円グラフだと…

都道府県だけに…

select ?birthPlace (count(?s) as ?num) where{?s a <http://dbpedia.org/ontology/Comedian>.?s <http://dbpedia.org/ontology/birthPlace> ?Place.?Place rdf:type <http://schema.org/Place>.?Place rdfs:label ?birthPlace.}group by ?birthPlace ORDER BY DESC(?num)

面白いデータを見つけてビジュアライズ作品を作りましょう!

検索すると面白いデータベース

• DBpedia Japanese• Wikipedia日本語版のデータが検索できます

•京都国際マンガミュージアム書誌情報LOD• マンガのデータが検索できます

•青空文庫LOD• 青空文庫に登録された文学作品を検索できます

•京都が出てくる本のデータ• 京都が舞台の小説やマンガを検索できます

※全てSPARQL Creator ・WP Sgvで利用できます

DBpedia Japanese• SPARQL EndPointに「http://ja.dbpedia.org/sparql」を入力

• Graph URIを全て消す

クリック!

京都が出てくる本のデータ• SPARQL EndPointに「http://lodcu.cs.chubu.ac.jp/SparqlEPCU/api/kyotobook_list」を

• Graph URIを全て消す

クリック!

「クラス指定無し」を指定してください

京都国際マンガミュージアムLOD• SPARQL EndPointに「http://mdlab.slis.tsukuba.ac.jp/sparql」を

• Graph URIに「http://purl.org/net/mdlab/kmm」を入力

クリック!

青空文庫LOD• SPARQL EndPointに「http://mdlab.slis.tsukuba.ac.jp/sparql」を

• Graph URIに「http://purl.org/net/aozora/resources」を入力

クリック!

注意

• マンガミュージアム・青空文庫LODは“WP Sgv”で“jsonp”を指定してください

jsonp

※参考

WordPressの設置(Windows編)

• XAMPPダウンロード• https://www.apachefriends.org/jp/download.html

xampp-portable-win32-5.6.12-0-VC11.zip

※参考

WordPressの設置(Windows編)

• XAMPPインストール・Apache起動• xampp-portable-win32-5.6.12-0-VC11.zipを解凍

• xampp/xampp-control.exe を実行

クリック!

※参考

WordPressの設置(Windows編)

• WordPress ダウンロード• DB設定の必要のないSQLite版を使いました

• 例えば:https://github.com/icryptic/WordPress-SQLite

一式Zipファイルとしてダウンロードできます

※参考

WordPressの設置(Windows編)

• WordPressインストール• WordPress-SQLite-master.zipを解凍

• 「WordPress-SQLite-master」フォルダをxampp/htdocsフォルダに移動

※参考

WordPressの設置(Windows編)

• ブラウザで「http://localhost/WordPress-SQLite-master/」を開く

後は、WordPressの初期設定を行ってください。