Universal Viewerにおける画像のコマ指定方法の一例

近年、博物館や図書館、文書館などにおいて、画像共有のための国際的な枠組みであるInternational Image Interoperability Framework(IIIF)を用いた画像公開が一般的になりつつあります。 https://iiif.io/ このIIIF画像の公開にあたり、MiradorやUniversal Viewerなどのビューアが使用されます。 https://projectmirador.org/ https://universalviewer.io/ 特に後者のUniversal Viewerが採用されたデジタルアーカイブシステムにおいては、「#?cv={画像のコマのインデックス}」を与えることで、コマを指定したURLを取得できることが多いです。 注意点として、インデックスは0からスタートしますので、2コマ目を指定したい場合には1を指定します。 「京都大学貴重資料デジタルアーカイブ」の例は以下です。 https://rmda.kulib.kyoto-u.ac.jp/item/rb00000125#?cv=1 「同志社大学デジタルコレクション」の例は以下です。 https://dgcl.doshisha.ac.jp/digital/collections/MD00000380/#?cv=1 ビューアがカスタマイズされている場合など、上記のパラメータが使用できない場合もありますが、コマ数を指定した画像共有のためのURL取得にあたり、参考になりましたら幸いです。

2024年2月2日 · 1 分 · Nakamura

Universal Viewer v4を使ったページの作成例

概要 以下のように、ページ全体にUniversal Viewerが表示されるページを作成しましたので、その備忘録です。Universal Viewer v4を使用しています。 https://nuxt3-demo-nine.vercel.app/uv/?manifest=https://dl.ndl.go.jp/api/iiif/3437686/manifest.json ソースコード 以下のソースコードを参考にしてください。 https://github.com/nakamura196/nuxt3-demo/blob/main/public/uv/index.html 以下のページにある https://github.com/UniversalViewer/universalviewer/wiki/UV-Examples 以下のサンプルを参考に、ページのリサイズに応じて、ビューアのサイズも変更されるようにしています。 https://codesandbox.io/s/uv-url-adapter-example-9d6x8 また、manifestというクエリパラメータを受け取る記述も含めています。 参考 以下を参考に、cdnを利用しない形でのNuxt3への導入を試みましたが、うまく動作させることができませんでした。こちらについては、引き続き調査を行いたいと思います。 https://codesandbox.io/s/uv-vite-example-9ie3rh まとめ 以下のページで、v3を用いた全画面表示の例が公開されていますが、本記事執筆時点では、v4の例が見当たりませんでした。 https://universalviewer.io/examples/uv/uv.html#?manifest=https://dl.ndl.go.jp/api/iiif/3437686/manifest.json 参考になりましたら幸いです。

2023年11月24日 · 1 分 · Nakamura