IIIF対応ビューワMiradorの最新版に右⇒左ページめくり方向を実装してみました(5/8追記あり)

IIIF対応ビューワの代表格の一つ、Miradorですが、アノテーション機能と複数画像同時表示機能という大変便利な機能を提供してくれている一方で、右から左へのページめくりに対応していないため、東アジア系の資料に適用することがなかなか難しい状況でした。以前に、対応版を作ってみましたが、ちょっと機能的にいまいちでしたので、改めて、最新版をもとに追加しなおしました。それがこちらです。

Mirador Viewer

…と言っても、これだけですと、Miradorの使い方を知っている人でないとあまりよくわからないと思います。そこでご用意したのが以下のものです。

http://candra.dhii.jp/nagasaki/mirador20170506/mirador/index2.html

右から左へのページめくりと、左から右へのページめくりが一つのビューワで混在できていると思います。ただし、「ギャラリー表示ビュー」のサムネイル一覧だけは、残念ながらまだ対応できていません。力不足で申し訳ありません。(どなたかやってみていただけると大変ありがたいです)

※もう少し調べてみたら、できました!というわけで、以下のものが完成版(?)です。

http://candra.dhii.jp/nagasaki/mirador20170507/mirador/index2.html

 

 

慶応大学メディアセンターデジタルコレクションのIIIF対応画像も、これで右から左のページめくりができるようです。Miradorの使い方をある程度ご存じの方向けになってしまいますが、たとえば以下のIIIF Manifestかdrop iconなどをお試ししてみてください。

http://dcollections.lib.keio.ac.jp/sites/default/files/iiif/NRE/110X-274-3-1/manifest.json

IIIF Drag-n-drop

 

なお、ビューワ自体をダウンロードしたい場合はこちらからどうぞ。(.tgz形式です)

 

それから、この仕組みについて、少しだけ御説明しておきますので、まだご存じないという人で、かつ興味がある人はちょっと読んでみてください。

 

まず、IIIFでは、一つの資料ごとに「IIIF Manifest」というファイルを用意することになっています。IIIF Manifestは、JSON-LDというWebで今流行しているフォーマットに基づいて書かれているものです。JSON-LDは、World Wide Web Consortium (W3C) で定められている規格であり、このフォーマットに従うことでJavascriptのプログラムがデータ間のリンクを簡単かつ効率的に解釈できるようになります(この説明は簡潔すぎてちょっと語弊があるかもしれませんのでご注意ください)。そして、JSON-LDに従ってどういう内容を書くべきか、ということについてはIIIF Presentation APIにおいて規定されています。(もう一つ関連する重要な話としてWeb annotationというデータモデルがあるのですが今回はそれについては省略します。)

 このIIIF Presentation APIでは、プロパティと値、という形で、一つの資料に関する様々な情報をIIIF manifest記述してブラウザに渡すことになります。資料に含まれる各ページ画像のURL、資料のメタデータ、資料に付与されたアノテーションのURL等がここには含まれることになります。資料の提供者やライセンスの情報もここに書き込むことになります。Webブラウザに読み込まれたIIIF対応ビューワは、このIIIF Manifestを受け取って、必要な画像やその他の情報を集めて、適宜整形してWebブラウザ上に表示することになります。

 さて、このIIIF Manifestに書いてもよいプロパティの中でviewingDirectionというプロパティがあります。これによって、一つの資料に含まれる画像を見ていく方向を規定できるようになっています。日本語資料のように右から左にページをめくっていく資料の場合には、"viewingDirection:right-to-left"と書くことになっています。IIIFという規格では、このようにして、右から左にページをめくっていく日本語等の資料にも対応しています。

 しかし、これは、あくまでも、規格上の記述の仕方の話です。このように記述しておけば、あとは、利用者側(で使っているビューワ等のソフトウェア)がそれを読み込んで右から左にページめくりできるようにすればよくなるのですが、そのビューワは誰が用意するのか、という話が次に出てきます。

 実は、IIIF対応ビューワの代表格の一つであるUniversal Viewerであれば、すでにその機能が実装されています。()ただ、Universal Viewerも優れたビューワの一つではあるのですが、こちらだと、せっかくつけたアノテーションが表示されなかったり、複数画面表示ができない、といった感じで、やや不足感があります。そういう機能を使ってみたければ、やはりMiradorをなんとかしなければ、ということになります。そこで今回、改めて、新しいMiradorにこの機能を組み込むことに挑戦してみたのでした。

 基本的には、ページめくりに関しては画像の順番の変更、サムネイル画像の並べ方に関してはCSSのdirection:rtlで対応しています。ページめくりに関しても、ページめくり矢印の機能を左右逆にするだけでもよかったかもしれないのですが、以前に実装した際にすでに画像の順番変更で対応してしまっていたので、その続きということでそのようにしてしまいました。ページめくり矢印の機能を逆にする実装の仕方もおいおい検討してみたいとも思っております。

 

 なお、このIIIF Presentation API及びIIIF Manifestについてより理解を深めたい人は、LOD Diaryの神崎正英さんによる連載をぜひご覧ください。