EN
ホーム 記事一覧 ブック DH週間トピックス 検索 このサイトについて
English
ホーム » Tags

IIIF

IIIFによる画像・資料相互運用

Mirador 3のimage tools（画像の回転など）を初期表示で有効にする方法

Mirador 3のimage tools（画像の回転など）を初期表示で有効にする方法

概要 今回はMirador 3のimage tools（画像の回転など）を初期表示で有効にする方法について説明します。 デフォルトのMirador 3では、Mirador 2ではデフォルトの機能として提供されていた、画像の回転や明度・コントラスト・彩度の調整機能は提供されていません。 これを実現するためには、以下のimage toolsというプラグインを追加する必要があります。 github.com 以下、プラグインの導入方法と、設定方法について説明します。 導入方法 image toolsプラグインの導入方法としては、上記のページの他、以下のリポジトリが参考になります。 モダンなフロントエンドビルドシステム github.com vueでの導入方法 github.com Nuxt.jsでの導入方法 github.com 設定方法 各ウインドウに対して、以下の設定が利用できます。 設定値 タイプ 初期値 説明 imageToolsEnabled boolean false プラグインの表示を有効にする imageToolsOpen boolean false デフォルトでimage toolsを開く 例えば以下のページで、image toolsを初期表示で有効にした例をご確認いただけます。 https://github.com/nakamura196/mirador-integration-vue/blob/master/src/App.vue まとめ Mirador 3の導入の参考になりましたら幸いです。

2021年9月16日 · 1 分 · Nakamura
【Omeka S モジュール紹介】Omeka Sで利用可能なIIIF対応ビューア

【Omeka S モジュール紹介】Omeka Sで利用可能なIIIF対応ビューア

概要 2021年9月15日時点でOmeka Sのモジュールとして提供されているIIIF対応ビューアをまとめます。 ビューア一覧 Universal Viewer github.com Mirador github.com Diva IIIF Viewer github.com まとめ 以下のページで導入イメージをご確認いただけます。Omeka Sを用いたIIIF画像配信の参考になりましたら幸いです。 diyhistory.org

2021年9月15日 · 1 分 · Nakamura
【機能開発】Omeka SのIIIFモジュールで、目次を加える機能を追加しました。（その２：階層構造を持つ目次の登録）

【機能開発】Omeka SのIIIFモジュールで、目次を加える機能を追加しました。（その２：階層構造を持つ目次の登録）

概要 前回の記事では、Omeka SのIIIF Serverモジュールを用いて、フラットな目次を追加する方法について説明しました。 nakamura196.hatenablog.com 今回は、階層構造を持つ目次を追加する方法について説明します。 公式のマニュアルはこちらにありますが、このマニュアルを和訳した記事も作成しました。不完全な日本語ですが、参考になりましたら幸いです。 nakamura196.hatenablog.com 詳細 前回は、以下の情報を入力することで、フラットな目次を作成しました。 cover,表紙,1 jyo,序,4-6 legend,凡例,6-15 catalogue,總目錄,16-18 toc,目次,19-20 ch1,きりつほ,20-35 ch2,はゝき木,35 各行は、以下の意味を持ちます。 {id}, {label}, {canvasIndexOrRangeId1};{canvasIndexOrRangeId2};...; {canvasIndexOrRangeIdN} ここでは、目次（id: toc）について、その内容を構造化します。 具体的には、まず、19コマ目を目次の内容（id: toc0）として、目次（id: toc）に含まれる形とします。 また、「きりつぼ」（id: ch1）と「はゝき木」（id: ch2）についても、目次（id: toc）に含まれるように修正します。 具体的には、以下のデータを用意します。上記のマニュアルにも記載がありますが、インデントは、階層構造をみやすくするために用いており、モジュール内の処理では無視されます。 cover,表紙,1 jyo,序,4-6 legend,凡例,6-15 catalogue,總目錄,16-18 toc,目次,toc1;ch1;ch2 toc1,内容,19-20 ch1,きりつほ,20-35 ch2,はゝき木,35 このデータをIIIF Serverモジュールの「Property for structures」として設定したプロパティ（今回の例では、dcterms:tableOfContents「Dublin Core: 目次」）の値として登録することで、下図のように、階層構造を持つ目次を実現することができます。 https://diyhistory.org/nakamura196/s/main/item/15 まとめ 今回は、Omeka SのIIIF Serverモジュールを用いて、階層構造を持つ目次を追加する方法について説明しました。今回は単純な階層構造を作成する例を示しましたが、以下のマニュアルページに記載があるような、複雑な階層構造も作成することができます。 https://github.com/Daniel-KM/Omeka-S-module-IiifServer#input-format-of-the-property-for-structures-table-of-contents 本モジュールを用いた、IIIFマニフェストへの目次情報を追加にあたり、本記事が参考になれば幸いです。

2021年8月13日 · 1 分 · Nakamura
【機能開発】Omeka SのIIIFモジュールで、目次を加える機能を追加しました。（その１：フラットな目次の登録）

【機能開発】Omeka SのIIIFモジュールで、目次を加える機能を追加しました。（その１：フラットな目次の登録）

概要 Omeka SのIIIF Serverモジュールについて、IIIFマニフェストに目次を加える機能を追加開発しました。以下の、ver 3.6.5.3から本機能が利用可能です。 github.com 本記事では、本モジュールを用いて、目次を追加する方法について説明します。なお、動画でも操作方法を紹介しています。参考なれば幸いです。 youtu.be 詳細 設定 公式の説明は以下にあります。 https://github.com/Daniel-KM/Omeka-S-module-IiifServer#config-options-for-manifest まず、本モジュールの設定画面において、「Property for structures」に指定するプロパティを選択します。ここで選択したプロパティの値に、目次の情報を入力することで、IIIFマニフェストに目次情報を反映させることができます。ここでは、例えば、「Dublin Core: 目次」を選択します。 データ登録 今回は、国立国会図書館で公開されている『校異源氏物語』の一部を例とします。 ここでは、アイテムの登録とBulk Importを用いたIIIF画像の一括登録の方法についても紹介します。Bulk Importの使い方については、以下の記事を参考にしてください。 nakamura196.hatenablog.com アイテムの登録 まず、アイテムを登録します。画面左部のメニューから「アイテム」を選択し、アイテム画面の画面右上部の「新規アイテムの追加」をクリックします。そして、ここでは最低限の情報として、タイトルに「校異源氏物語」、識別子（dcterms:identifier）に「kouigenjimonogatari」を与えます。 画像（メディア）の登録 次に、画像の登録を行います。今回は、IIIF画像を登録する例を紹介します。具体的には、国立国会図書館で配信されているIIIF画像の一部（はじめの35コマ）を登録します。 一括登録用のデータとして、以下のようなCSVファイルを用意します。ポイントとして、列「iiif」にIIIF画像サービスのURL、列「item」に先に入力した「kouigenjimonogatari」を与えます。 https://github.com/omeka-j/Omeka-S-module-BulkImport-Sample-Data/blob/main/media_iiif.csv データの一括登録は、Bulk Importを用います。画面左のメニューから「Bulk Import」をクリックし、「CSV - Medias」をクリックします。そして先に作成したCSVファイルをアップロードして、「Continue」を押します。次の設定画面「Start import」はそのままで、「Continue」>「Start import」を選択して、画像を一括登録します。 アイテムの一覧画面から、先ほど登録した「校異源氏物語」を確認すると、35件の画像が登録されていることを確認できます。 目次の登録 この35件の画像について、目次情報を付与します。ここでは、1コマ目に表紙（id: cover）、4-6コマ目に序（id: jyo）、6-15コマ目に凡例（id: legend）、16-18コマ目に総目録（id: catelogue）、19-20コマ目に目次（id: toc）、20-35コマ目に「きりつぼ」（id: ch1）、35コマ目に「はゝき木」（id: ch2）を与えます。 具体的には、下図のように、プロパティ「目次」を追加して、各行が以下のフォーマットに基づく情報を入力します。 {id}, {label}, {canvasIndexOrRangeId1};{canvasIndexOrRangeId2};...; {canvasIndexOrRangeIdN} または、 {id}, {label}, {canvasIndex1}-{canvasIndexN} 具体的には、以下を入力します。 cover,表紙,1 jyo,序,4-6 legend,凡例,6-15 catalogue,總目錄,16-18 toc,目次,19-20 ch1,きりつほ,20-35 ch2,はゝき木,35 この後、アイテムの公開ページに遷移し、Universal Viewerを確認すると、正しく目次が設定されていることを確認できます。 ...

2021年8月13日 · 1 分 · Nakamura
【機能開発】Omeka SのIIIF Serverモジュールにおけるライセンスプロパティの不具合修正

【機能開発】Omeka SのIIIF Serverモジュールにおけるライセンスプロパティの不具合修正

Omeka SのIIIF Serverモジュールについて、IIIF Presentation APIのバージョン2を使用する際の、ライセンスプロパティにおける不具合を修正しました。 具体的には、以下のIIIF Serverモジュールのライセンスに関する設定において、設定内容がIIIFマニフェストに反映されない不具合を修正しました。 以下の、ver 3.6.5.3から本修正が反映されたモジュールを利用可能です。 github.com 本不具合でお困りの方の参考になれば幸いです。 なお、以下がMerge requestです。 gitlab.com

2021年8月13日 · 1 分 · Nakamura
【和訳】Omeka S IIIF Serverモジュールの目次情報の追加方法

【和訳】Omeka S IIIF Serverモジュールの目次情報の追加方法

Omeka S IIIF Serverモジュールの目次情報の追加方法に関するマニュアルの和訳です。公式のマニュアルは以下です。 github.com 本モジュールを用いて、IIIFマニフェストに目次情報を追加する際の参考になりましたら幸いです。 Config options for manifest Input format of the property for structures (table of contents) 構造（目次）のプロパティの入力形式 デフォルトの構造は、iiifメディアの単純なシーケンシャルリストです。 目次を使用して複雑なドキュメントの構造を構築するには、特定のプロパティを使用して、必要なjsonを値に入力するか、次の形式のリテラル値を入力します。各行は構造（目次）の一部です。 {id}, {label}, {canvasIndexOrRangeId1}; {canvasIndexOrRangeId2}; ...; {canvasIndexOrRangeIdN} 例： cover, Front Cover, 1 r1, Introduction, 2; 3; 4; 5 backCover, Back Cover, 6 Range ID（行の最初の部分）は、URIの作成に使用されるRangeの名前です。他のインデックスとの衝突を避けるために、数値であってはなりません。スペース、発音区別符号、またはその他の特殊文字を含まない単純な英数字の名前である必要があります（すべてのコーディング規約において非常に安定しています）。「/」を含めることはできません。とにかく、この名前は最後のuriでURLエンコードされます。 さらに、Range IDはすべてのアイテムで一意である必要があります。 入力を省略した場合、行番号が使用されます。その場合、特定のRange名がないことを示すために最初のコンマを残してください。たとえば上記でr1が指定されていない場合、Range IDはr2になります。Rangeを指すrと2行目を指す2から構成されます。ただし、新しい行が挿入されるとURIが変更されるため、この方法はお勧めしません。 各行の2番目の部分は、章などのRangeのラベルです。空の場合、IIIFマニフェスト内容には記述されますが、IIIF対応ビューアなどでは表示されません。 各行の最後の部分は、現在の範囲に含まれる上位のCanvasまたは上位のRangeのリストであるため、基本的には画像とサブセクションのリストです。 ほとんどの場合、Canvasインデックスはメディアの位置です。iiifで使用されているメディアのみが列挙され、アイテムに添付されているpdf、xmlなどの特定のメディアは列挙されないため、添付メディアのリストのOmeka内部位置とは異なる可能性がある点に注意してください。他のインデックスは、Range ID（各行の最初の部分）のリストにある場合、Rangeインデックスとして管理されます。そうでない場合は、Canvasの英数字の名前になります。 最初の行の最初のRange IDは、ツリーのルートです。ルートは1つだけです。複数のルートがある場合（以下を参照）、すべてのルートをブランチとしてメイン範囲が追加されます。 したがって、このリテラル値から複雑な階層的な目次を作成することが可能です。以下は、不完全で誤った例を使用します。 toc, Table of Contents, cover; intro; r1; r2; backcover cover, Front cover, cover intro, Introduction, 2-5 r1, First chapter, 6; r1-1; r1-2; 12 r1-1, First section, r1-1-1; r1-1-2; illustration1; illus2 r1-1-1, First sub-section, 8-9 r1-1-2, Second sub-section, 9-10 r2, Second chapter, 13 backcover, Back cover, "backcover" illustration1, First illustration non paginated, illus1 illustration3, Third illustration non paginated, illus3 iiif v2のjson出力例： ...

2021年8月11日 · 4 分 · Nakamura
Mirador 3をページ内の特定の領域に埋め込む方法

Mirador 3をページ内の特定の領域に埋め込む方法

先日、以下の記事で、Nuxt.jsを用いて、Miradorをページ内の特定の領域に埋め込む方法を紹介しました。 nakamura196.hatenablog.com 今回は、Vue.jsなどのフレームワークを使わずに、Miradorを埋め込む方法について紹介します。 具体的には、以下のページのソースコードをご確認ください。 https://nakamura196.github.io/nuxt-mirador/embedded2 上記は単純なHTMLファイルです。 Miradorを画面に埋め込む際、Miradorを表示する要素のID（例：mirador）を指定します。この時、以下のようなCSSを与えることで画面の一部に埋め込むことができます。 #mirador { height: 600px; position: relative; width: 100%; } ポイントは、「position: relative;」です。これを与えないと、heightなどを指定しても全画面で表示されてしまいます。 Mirador 3の利用において、本記事がお役に立つことがあれば幸いです。

2021年8月10日 · 1 分 · Nakamura
Mirador 3をNuxt.jsで使用する方法を紹介するリポジトリを作成しました。

Mirador 3をNuxt.jsで使用する方法を紹介するリポジトリを作成しました。

概要 以下の記事で、Mirador 3をVueで使用する方法を紹介しました。 nakamura196.hatenablog.com 上記に続いて、今回は、Nuxt.jsでMirador 3を使用する方法を紹介するGitHubリポジトリを作成しました。 github.com 上記リポジトリにおいて、Miradorをページ全体に表示する例に加えて、ページ内の特定の領域に埋め込む例を用意しています。 https://nakamura196.github.io/nuxt-mirador/embedded 本記事では、上記ページに関する説明を行い、Miradorの使い方の一部について紹介します。 詳細 上記のページは、以下について説明することを意図しています。 Miradorを画面の一部に埋め込む プログラムでカンバスを指定する プログラムでZoomを行う それぞれについて説明します。 なお、ソースコードは以下で確認できます。 https://github.com/nakamura196/nuxt-mirador/blob/master/pages/embedded.vue Miradorを画面の一部に埋め込む Miradorを画面に埋め込む際、Miradorを表示する要素のID（例：mirador）を指定します。この時、以下のようなCSSを与えることで画面の一部に埋め込むことができます。 #mirador { height: 600px; position: relative; width: 100%; } ポイントは、「position: relative;」です。これを与えないと、heightなどを指定しても全画面で表示されてしまいます。 また、以下のスタンフォード大学図書館のMirador 3の埋め込みを例として、Configを設定しました。 https://dlmenetwork.org/library/catalog/oai:N%2FA:Manchester~18~18~162~225617 const config = { id: "mirador", windows: [ { id: 'known-window-id', manifestId: this.manifestId, }, ], window: { allowClose: false, allowMaximize: false, allowFullscreen: true, hideWindowTitle: true, }, workspaceControlPanel: { enabled: false, }, } ポイントは、「workspaceControlPanel」を「enabled: false」にしている点や、「allowClose」「allowMaximize」をfalseにしている点ですが、必要に応じてカスタマイズしてください。 ...

2021年8月7日 · 1 分 · Nakamura
【アプリ紹介】IIIF pocketのご紹介

【アプリ紹介】IIIF pocketのご紹介

Cultural Japanプロジェクトの一環で開発したアプリケーション「IIIF Pocket」に関するご紹介です。 pocket.cultural.jp 本アプリケーションの説明は、以下のGoogleドキュメントにまとめています。 docs.google.com IIIFリソースの管理と活用にお役に立てば幸いです。

2021年7月24日 · 1 分 · Nakamura
【Omeka Sモジュール紹介】IIIF Server / Image Server / Universal Viewer

【Omeka Sモジュール紹介】IIIF Server / Image Server / Universal Viewer

Omeka SのIIIF関連モジュールである「IIIF Server」「Image Server」「Universal Viewer」の説明およびインストール手順を以下で紹介しています。 youtu.be Omeka SでのIIIF配信において、参考になりましたら幸いです。

2021年7月23日 · 1 分 · Nakamura
Cultural Japanで集約したIIIFマニフェストをまとめたIIIFコレクションのご紹介

Cultural Japanで集約したIIIFマニフェストをまとめたIIIFコレクションのご紹介

Cultural Japanで集約したIIIFマニフェストについて、それらをまとめたIIIFコレクションを以下からご確認いただけます。 https://www.kanzaki.com/works/2016/pub/image-annotator?u=https://app.cultural.jp/iiif-collection/collection.json なお、各々のIIIFマニフェストの利用にあたっては、各収録DBの利用条件を確認してください。 本コレクションには、Cultural Japan側で動的に生成したIIIFマニフェストを含みます。上記のコレクション一覧において、【動的生成】という表記で識別することができます。この動的生成にあたっては、AWS Lambdaを利用しており、リクエスト毎にJapan SearchのRDFストア、およびCultural JapanのRDFストアに問い合わせを行い、JSONデータを生成しています。なお、本動的生成IIIFマニフェストを作成する条件は、高精細画像（jps:accessInfo/schema:associatedMedia）を持つアイテムとしています。 動的生成マニフェストの場合、必ずしも提供元アイテムのすべての画像を含めることができていない（jps:accessInfo/schema:associatedMedia で指定された画像のみを使っている）点で不完全ではありますが、IIIFマニフェストを読み込むSelf Museumやその他のIIIF対応ビューアに取り組むことが可能となるといった利点もあります。 self-museum.cultural.jp 世界中で発信される日本文化に関するIIIFリソースを概観するとともに、IIIFを用いたアプリケーション開発の素材としてお役に立てば幸いです。

2021年7月23日 · 1 分 · Nakamura
Mirador 3をVueで使用する方法を紹介するリポジトリを作成しました。

Mirador 3をVueで使用する方法を紹介するリポジトリを作成しました。

Mirador 3をVueで使用する方法を紹介するリポジトリを作成しました。Vueを使ったアプリケーション開発の参考になれば幸いです。 github.com 本リポジトリの作成にあたっては、以下を参考にさせていただきました。 github.com なお、別のより簡単な方法として、UMD（Universal Module Definition）ビルドを利用する方法もあります。単純にMirador 3を利用したい場合には、以下の方法をおすすめします。 github.com 上記サイトでは、（今回紹介するリポジトリで示したように）「パッケージマネージャーを通じたインストールは、より柔軟なカスタマイズを可能とします。」と記載されています。 Installing through a package manager can give you more flexibility for customization.

2021年7月22日 · 1 分 · Nakamura
【機能開発】Omeka SのIIIF ServerモジュールにおけるImage APIを使用しない設定の追加

【機能開発】Omeka SのIIIF ServerモジュールにおけるImage APIを使用しない設定の追加

概要 Omeka SのIIIF Serverモジュールについて、Image APIを使用しない設定を追加する機能開発を行いました。これにより、レンタルサーバなどのリソースが限られた環境において、IIIFマニフェストなどの配信が容易となります。デジタルアーカイブシステムの持続性と利活用性の向上にむけて、本機能がお役にたてば幸いです。 背景 Omeka SのIIIF Serverモジュールは、Omeka Sに登録されたメタデータから、IIIFマニフェストファイルなどを生成するモジュールです。Omekaの様々なモジュールを開発されているDaniel-KM氏が主に開発されています。 github.com 画像については、Image Serverが必要となります。Awesome IIIFに挙げられているようなIIIF ServerをOmeka Sとは別に導入するか、Omeka SのImage Serverモジュールを使用することができます。後者については、Omeka Sのみで実現することができるため、LAMP環境が構築されたレンタルサーバを利用して、IIIF準拠の画像やマニフェストファイルなどの配信が可能となります。レンタルサーバはCPUやメモリといったリソースが限定されますが、メンテナンスコストが低い点が利点として挙げられます。 一方、レンタルサーバなどのリソースが限られた環境に、上述のOmeka SのImage Serverモジュールを導入するには課題があります。Image Serverモジュールが動的にタイル画像を配信する際、この処理に時間がかかり、タイル画像の表示が遅れる事象が確認されました。((なお、事前にタイル画像を生成するオプションも提供されています。これにより、リクエストがある度にタイル画像を生成する処理は不要となりますが、ディスク使用量の増加といったデメリットもあります。)) 解決策 IIIFマニフェストにおいて、必ずしもIIIF Image APIに準拠する必要はなく、単純にJPEG画像等を参照することもできます。((なお、これにより画像の動的なリサイズや回転、切り出し等ができなくなるため、機能が限定されるデメリットもあります。)) www.kanzaki.com そこで、レンタルサーバなどのリソースが限られた環境において、Omeka Sを用いたIIIFマニフェストの配信を行うための新たなオプションとして、このImage APIを使用せずに、Omeka Sに登録されたJPEG画像等をそのまま使用する設定をIIIF Serverモジュールに追加しました。以下のversion 3.6.4.3から本機能が利用できます。 github.com 具体的には、IIIF Serverモジュールの以下の設定画面で有効化できます。 本モジュールは、東京大学工学・情報理工学図書館の工学史料キュレーションデータベースで使用されています。 curation.library.t.u-tokyo.ac.jp 先述した通り、本設定の有効化により、IIIFで利用できる機能が一部制限されるため、最善の手段ということではありませんが、リソースが限られたサーバ上でのIIIFマニフェストの配信手段のオプションとして、本機能がお役にたてば幸いです。

2021年7月22日 · 1 分 · Nakamura
「起絵図」のIIIF実装

「起絵図」のIIIF実装

概要 「起絵図」のIIIF実装を行いました。東京大学駒場図書館所蔵「大日本海志編纂資料」に含まれる越絵図を対象にしています。 https://utda.github.io/kaishi/ 以下の動画から概要をご確認ください。 「起絵図」のIIIF実装 作成したアプリケーション 東京国立博物館による「越絵図」の説明は以下です。 「起絵図（おこしえず）」は、平面図を描いた台紙に、壁面や天井の図を貼り付け、建物の立体的な構造を再現する折畳式の簡易模型です。とくに小さな空間に複雑な立体構造を持つ茶室の再現に適した図法として活用されました。（東京国立博物館 - 展示 日本美術（本館） 日本の博物学シリーズ 起絵図より） この越絵図の表現を、IIIFの「代替資源の選択」を用いて実装しました。また、ビューア「Mirador 2」をカスタマイズし、越絵図の動きをアニメーションで表現できるようにしました。ビューアを開き、画面上部の「Play」ボタンを押してください。 作成方法 IIIFマニフェストファイルの作成 IIIFの「代替資源の選択」を参考に、以下のようなIIIFマニフェストファイルを作成します。 https://github.com/utda/kaishi/blob/master/docs/iiif/7-2-47/manifest.json itemの配列に対して、重ねて表示したい画像の情報を追加します。この時、onに指定するカンバスのURIについて、重ねたい画像の表示箇所を指定します。以下の例は、元の画像（重ねられる画像）のサイズで作成したカンバスに対して、開始位置（2560,512）から幅（3072,4096）までの範囲に画像を重ねるための記述です。 https://github.com/utda/kaishi/blob/master/docs/iiif/7-2-47/manifest.json#L111 この範囲の指定が最もコストがかかる部分ですが、今回は以下のように、重ねる画像の位置情報が記述されたxmlファイルがすでに存在しました。 https://github.com/utda/kaishi/blob/master/src/data/xmls_layered/7-2-47.xml このxmlファイルに記載された情報から上記のitemsの配列を自動作成しました。 Mirador 2のカスタマイズ Mirador 2のカスタマイズ方法はこちらに記載があります。この記載を参考に、以下のような記述を追加しました。 https://github.com/utda/kaishi/blob/master/docs/mirador/index.html#L95 「Play」「Stop」「Check All」「Clear」ボタンを追加し、それぞれのボタンをクリックした際に実行される関数を追加しています。まず、Miradorのレイヤータブにあるチェックボックスの一覧を取得します。次にsetIntervalを使って、一定間隔毎にチェックボックスをクリックします。 まとめ 以上、起絵図をお楽しみいただくとともに、IIIFのレイヤー機能を使ったアプリケーション作成の参考になりましたら幸いです。

2020年8月14日 · 1 分 · Nakamura
透過光画像を使ったIIIFアプリケーション

透過光画像を使ったIIIFアプリケーション

概要 「透過光画像を使ったIIIFアプリケーション」を作成しました。東京大学総合図書館所蔵の「シェリー書簡」を対象にしています。 utda.github.io 作成したアプリケーション 本アプリケーションではIIIFの「代替資源の選択」を用いて、オリジナル画像と透過光画像を比較する環境を提供します。 4つの方法で比較環境を提供しており、「IMAGE COMPARISON WITH A SLIDER 」「MIRADOR」「IIIF CURATION VIEWER」「IMAGE ANNOTATOR」を用いています。 IMAGE COMPARISON WITH A SLIDER Digiratiが開発した画像比較ビューアを使用しています。画面中央のスライダーを動かして、画像を比較することができます。 MIRADOR Miradorのレイヤー機能を用いて比較します。画面左部のレイヤータブをクリックし、opacityを変更してみてください。 IIIF CURATION VIEWER CODH（Center for Open Data in the Humanities）が開発しているIIIF Curation Viewer Embeddedを用いて表示します。画面右上のラジオボックスで表示画像を切り替えることができます。 Image Annotator 神崎正英氏が開発しているビューアで表示します。画面右上のchoiceで表示内容を切り替えてください。…を行うと、アノテーションを付与している箇所のみ、透過光画像を表示することができます。 作成方法 Level 0 IIIF Image APIに準拠した画像の作成 Digirati社製のビューアについては、IIIFマニフェストは不要で、IIIF Image APIに準拠した画像が必要になります。そこで、今回はIIIF対応のImage Serverを必要としないIIIF Image APIのレベル0に準拠した画像生成を行いました。この利点として、Image Serverが不要となることで、GitHub PagesやAmazon S3といった静的ファイルのホスティングサービスのみでの画像公開が可能となり、運用コストやセキュリティリスクを軽減することができます。一方のデメリットとしては、事前に作成したタイル画像を配信するため、任意の範囲の画像切り出しに対応していない点があげられます。この点はカンバスに対して領域を指定するアノテーションやキュレーションでは問題になりませんが、その領域の切り出し画像そのものがほしいといったニーズには答えられないことが多いです。 今回は特定の領域の画像そのものが必要ではなかったため、IIIF Image APIのレベル0を採用することにしました。なお、Mirador等のビューアを使った画像比較では、IIIF Image APIを使用しない方法もあります。しかし、今回はDigirati製のビューアで本APIが必要だったため、Image APIのレベル0を使ったIIIFマニフェストファイルを作成することにしました。 IIIF Image APIのレベル0に対応した画像生成にはこちらのスクリプトを参考にしました。また、Excelファイルでまとめた情報を入力として、本スクリプトを実行可能な環境も用意しました。お役に立てば幸いです。 上記リポジトリの例にあるように、今回はGitHub Pagesでタイル画像を公開しました。 github.com IIIFマニフェストファイルの作成 IIIFの「代替資源の選択」を参考に、以下のようなIIIFマニフェストファイルを作成します。 代替資源を使ったIIIFマニフェストファイルの作成については、こちらの記事を参考にしてください。 ...

2020年8月14日 · 1 分 · Nakamura