IIIF対応ビューワ「Universal Viewer」と「Mirador」の使い方について

このページでは、画像データの効果的・効率的な共有を行うことができる「IIIF(International Image Interoperability Framework:トリプルアイエフ)」に対応したビューワ「Universal Viewer」と「Mirador」の利用方法を紹介します。

  • 東京大学学術資産アーカイブ化推進室が構築する画像公開システムは、IIIFに対応しています。(赤枠の [ iiif マニフェスト ] というアイコンが画面上に表示されているものは、IIIF対応の公開画像です。)
  • このシステムでは、「Universal Viewer」あるいは「Mirador」ボタンをクリックすることで、画像を閲覧するためのビューワを選ぶことができます。「Universal Viewer」「Mirador」は操作方法や機能が少し違っていますので、以下のマニュアルを参照して、使いやすい方を選択してください。
iiif-トップ

 

 

 

 

 

 

 

 

 

 

 


iiif-icon2
このアイコンをIIIF対応ビューワにドラッグ&ドロップすることで、画像を表示することができます。(ワンクリックの場合はJSONファイルが開きます。)
UV-icon
Universal Viewerで画像を表示するためのボタンです。
Mirador-icon
Miradorで画像を表示するためのボタンです。

  •  Universal Viewerについて
UV基本画面
番号  
UV-1
Zoom/Rotate

画像の上にマウスカーソル(マウスポインター)を置くと「+」「-」「回転矢印の記号」が表示されます。このマークで、画像を「拡大」「縮小」「回転」させることができます。

※ 「Universal Viewer」「Mirador」の両方とも、マウスのホイール操作でも画像の拡大・縮小ができます。また、ダブルクリックで画像が拡大されます。

UV-2
ATTRIBUTION
画像の所有者、原資料の所蔵機関等の表示スペースです。(×印で、このウインドウを閉じることができます。)

UV-3
Download

UVdownload
Downloadボタンをクリックすると、画像をダウンロードすることができます。

UV-3

Share

UV-share
Shareボタンをクリックすると、いま見ている画面のURLを取得できます。また、このボタンをクリックすると表示される「Embed」タブでは、ウェブサイトに貼り付けることができるHTMLタグの形で取得することができます。
UV-4
Full Screen
画面をフルサイズに切り替えることができます。
UV-5
MORE INFORMATION
この画像のメタデータ、ライセンス情報など、様々な情報を確認できるウインドウが開きます。

  • Mirador について
Mirador基本画面

 

番号  
M-1
スロット数の変更/レイアウト変更
複数の画像を並べたいときは、このボタンから画面数を増やすことができます。
M-2
アノテーション

画像にアノテーション(メモやタグ)を付けることができます。
参考例:東京大学総合図書館所蔵の『直江状』
※付与したアノテーションは、あなたの手元のローカル環境(ブラウザ)に保存されます。そのままインターネット上に公開されるわけではありません。

M-3
画像操作
この「画像操作」をアクティブ状態にすると、画像の見た目を調整できるボタンが表示されます。この機能により、「90度右回転」、明度やコントラストの調整、色反転などが画面上で容易に行えます。
M-4
サムネイル
(複数画像の場合は)サムネイルの表示/非表示を切り替えられます。
M-5

画像の位置や大きさを調整できます。「家」の形をしたボタンで、調整内容をリセットすることができます。

※「Mirador」 「Universal Viewer」の両方とも、マウスのホイール操作でも画像の拡大・縮小ができます。また、ダブルクリックで画像が拡大されます。

M-6, M-7
フルスクリーン表示

Mirador-fullscreen
画面をフルサイズに切り替えることができます。
M-6
この資料の情報を表示
Mirador-info
この画像のメタデータ、ライセンス情報など、様々な情報を確認できます。
M-6
画面表示モード
Mirador-gamen
本のように見開きで画像を見る、サムネイルを並べるなど、画像表示モードの切り替えができます。
 
M-6
Drag and Drop to another IIIF viewer
Mirador-mani

このマークをIIIF対応ビューワにドラッグ&ドロップすると、その画像を閲覧できるようになります。(ワンクリックの場合はJSONファイルが開きます。)

〔この機能はプラグイン(mirador-dragndrop-link-plugin)を利用しています。〕

M-6
Download

Mirador-download

画像をダウンロードすることができます。

〔この機能はプラグイン(mirador-plugins)を利用しています。〕


tips!【Mirador で画像を並べる方法】※あくまで一例です

MiradorPoint-1

 

 

 

 

 

 

 

 

 

 

 

『百鬼夜行図』(東京大学総合図書館所蔵)

 

2つの資料を比較するため、上下2段に画像を並べてみる。

  • 画面左上のスロット数の変更で「下にスロット追加」を選択すると、下段に空の画面が追加されます。
  • 右上の「レイアウト変更」でも同じ操作が可能です。
百鬼3

 

 

 

 

 

 

 

 

 

 

 

 

  • 京都大学貴重書デジタルアーカイブの『付喪神絵巻』のIIIFマニフェストを、先ほど追加した下段の画面上にドラッグ・アンド・ドロップします。
百鬼3

            

 

 

 

 

 

 

 

 

 

 

『付喪神絵巻』(京都大学附属図書館所蔵)部分

 

並んだ!

百鬼4

       

 

 

 

 

 

 

 

 

 

 

 (上)『百鬼夜行図』(東京大学総合図書館所蔵)、(下)『付喪神絵巻』(京都大学附属図書館所蔵)部分


  • インターネット上の画像を比較する際、これまでは複数のウインドウを同時に立ち上げたり、印刷して見比べたりしていたかと思います。さらに、それぞれのビューワの使い方を知っておく必要もありました。IIIF対応で公開されている画像なら、このように同一ビューワ内に、簡単・便利に画像を表示することができます。また、画像を並べることの他にも様々な機能が用意されていますので、是非このビューワの機能をご活用ください。
    (下図は、さらに国立国会図書館が公開している「百鬼夜行絵巻」も追加した画面です。)
百鬼5

  

 

 

 

 

 

 

 

 

 

 

 (上)『百鬼夜行図』(東京大学総合図書館所蔵)、(中)『付喪神絵巻』(京都大学附属図書館所蔵)部分、(下)『百鬼夜行絵巻』(国立国会図書館所蔵)


IIIF対応の主な画像公開サイト(国内)※2018年5月時点の情報です

(大学図書館、研究機関等)

(国立国会図書館、公共図書館等)

このページで紹介した「Universal Viewer」「Mirador」は、オープンソースソフトウェアとして開発が進められているビューワです。そのため、各機関のデジタルアーカイブ機能に合わせて機能を追加したり、使い勝手が良いように工夫をしているサイトも多くあります。そのため、同じ「Universal Viewer」「Mirador」であっても、機能やボタンの位置などに多少の違いがありますので、その点はご了承ください。


参考情報