ホーム 記事一覧 ブック DH週間トピックス 検索 このサイトについて
English
mirador-sync-windowsを試す

mirador-sync-windowsを試す

概要 mirador-sync-windowsは、以下のように説明されています。 https://github.com/UCLALibrary/mirador-sync-windows (機械翻訳)同じオブジェクトの異なるスペクトル画像など、ほぼ同一の画像を複数比較する際に、複数のウィンドウで同時にアクションを適用することが役立ちます。 使用イメージは以下です。 https://youtu.be/Ls2zvJpSRlc 注意点として、Mirador 2向けのプラグインとなっており、またリポジトリもアーカイブされています。 今回は、このmirador-sync-windowsを試すリポジトリを作成したので、紹介します。 リポジトリ https://github.com/nakamura196/mirador2-sync-windows/ 使い方 以下のように、manifestパラメータに、比較したいマニフェストファイルを;で区切って指定します。 https://nakamura196.github.io/mirador2-sync-windows/?manifest=https://nakamura196.github.io/mirador2-sync-windows/data/examples/org.json;https://nakamura196.github.io/mirador2-sync-windows/data/examples/inf.json GUIの使用方法については、上記の動画をご参照ください。 上記の例は、以下の「シェリー書簡の透過光画像を使ったIIIFアプリケーション」のデータを利用しています。 https://utda.github.io/shelley/ まとめ 今後、本機能をMirador 3のプラグインとして開発したいと思います。 また本モジュールはほぼ同一の画像を複数比較することを目的としていますが、対応点の計算などにより、ほぼ同一でない画像の比較も行えるような機能開発を行いたいと思います。 mirador-sync-windowsについて、参考になりましたら幸いです。

東寺百合文書WEBのデータをIIIFに変換する

東寺百合文書WEBのデータをIIIFに変換する

概要 京都府立京都学・歴彩館が所蔵している国宝・東寺百合文書を公開する東寺百合文書WEBで公開されている画像を利用させていただく機会があり、公開されているデータをIIIF形式に変換して公開するリポジトリを作成しました。 https://github.com/nakamura196/toji_iiif 以下のデータセットを使用させていただきました。 https://hyakugo.pref.kyoto.lg.jp/?page_id=1481 特に、以下のURLから、画像の一覧を確認することができます。 https://nakamura196.github.io/toji_iiif/ ポイント IIIFコレクション 以下のURLからIIIFコレクションにアクセスすることができます。これにより、機械的にアクセスすることができます。 https://nakamura196.github.io/toji_iiif/iiif/set/3/collection.json width, heightの情報 各アイテムには、以下のようなURLからアクセスできます。 https://nakamura196.github.io/toji_iiif/iiif/3/1/manifest.json 特に、各画像のサイズの情報は、冒頭のデータセットには含まれていないため、有用な情報になり得るかと思います。 まとめ 東寺百合文書WEBで公開されているデータを機械的に処理する際などの参考になりましたら幸いです。

tropy-plugin-iiifを試す

tropy-plugin-iiifを試す

概要 tropy-plugin-iiifを試す機会がありましたので、備忘録です。 https://github.com/tropy/tropy-plugin-iiif tropy-plugin-iiifは以下のように説明されています。 Tropy plugin to import IIIF manifests 準備 Tropyをインストールします。 https://tropy.org/ 次に、以下のリンク先から、最新のzipファイルをダウンロードします。 https://github.com/tropy/tropy-plugin-iiif/releases/latest 設定 > プラグイン で以下を開きます。 「プラグインをインストール」ボタンをクリックして、ダウンロードしたzipファイルを選択し、「有効にする」をクリックします。 これでインストールは完了です。 IIIFマニフェストのインポート ファイル > インポート から、tropy-plugin-iiifを選択します。 別途ダウンロードしたIIIFマニフェストファイル(jsonファイル)を選択します。 以下のように、IIIFマニフェストの情報をインポートできました。 ダウンロードされた画像は、プロジェクトごとに作成される.tropyフォルダのassetsに格納されていました。 参考:PDFエクスポート 以下のようなフォーマットのPDFが作成されました。 ページごとに、アイテムや画像のメタデータが表示され、使いやすいように思いました。 まとめ 今回はIIIFマニフェストのインポート機能について紹介しましたが、現在、IIIFコレクションでのエクスポートを行うプラグインが開発されているとのことでした。 https://iiif.io/event/2024/los-angeles/schedule/#107 Tropyを使用することで、今後データの作成と公開の両方を担うことができそうです。 参考になりましたら幸いです。

@iiif/parserを試す

@iiif/parserを試す

概要 @iiif/parserというnpmモジュールを知ったので、一部の機能を試してみました。 https://github.com/IIIF-Commons/parser 使い方 以下は一例です。v2のIIIFマニフェストを、v3に変換します。 "use client"; import { useState } from "react"; import { convertPresentation2 } from "@iiif/parser/presentation-2"; import { Button, Label, TextInput } from "flowbite-react"; import ComponentsPagesParserPre from "./pages/parser/pre"; type ManifestData = any; export default function ComponentsParser() { const [url, setUrl] = useState<string>( "https://iiif.dl.itc.u-tokyo.ac.jp/repo/iiif/fbd0479b-dbb4-4eaa-95b8-f27e1c423e4b/manifest" ); const [data, setData] = useState<ManifestData>(null); const fetchAndConvertManifest = async ( manifestUrl: string ): Promise<void> => { try { const response = await fetch(manifestUrl); const manifestJson = await response.json(); const convertedManifest = convertPresentation2(manifestJson); setData(convertedManifest); } catch (error) { console.error("Failed to fetch or convert manifest", error); setData("Error fetching or converting manifest."); } }; const handleSubmit = (event: React.FormEvent<HTMLFormElement>): void => { event.preventDefault(); fetchAndConvertManifest(url); }; return ( <> <form className="flex flex-col gap-4" onSubmit={handleSubmit}> <div> <Label htmlFor="url" value="IIIF Manifest URL (v2)" /> <TextInput id="url" type="text" value={url} placeholder="https://example.com/iiif/manifest.json" required onChange={(e) => setUrl(e.target.value)} /> </div> <Button type="submit">Submit</Button> </form> <div className="mt-8"> <ComponentsPagesParserPre data={data} /> </div> </> ); } まず、以下でインポートします。 ...

Omeka Sで動画を公開する

Omeka Sで動画を公開する

概要 Omeka Sで動画を公開する方法について調べてみましたので、備忘録です。 標準機能 Omeka Sは標準で動画をサポートしています。 以下は標準の機能を使用した例です。 以下のmp4ファイルを使用させていただいています。 https://file-examples.com/storage/fe4e1227086659fa1a24064/2017/04/file_example_MP4_480_1_5MG.mp4 具体的には、以下のように<video>タグが使用されていました。 <div class="media-render file"> <video src="https://omeka-d.aws.ldas.jp/files/original/5060f3ba2537676746a7aa69c9884c64daac300b.mp4" controls=""> <a href="https://omeka-d.aws.ldas.jp/files/original/5060f3ba2537676746a7aa69c9884c64daac300b.mp4">5060f3ba2537676746a7aa69c9884c64daac300b.mp4</a> </video> </div> 同様に.movファイルをアップロードしたところ、ブラウザ依存かと思いますが、無事に再生されました。 IIIF Server IIIF Serverモジュールを使用することで、IIIFマニフェストファイルを配信することが可能になります。 https://omeka.org/s/modules/IiifServer/ これをインストールし、合わせて、Universal Viewerをインストールします。 https://omeka.org/s/modules/UniversalViewer/ 結果、以下のように、Universal Viewerが表示され、マニフェストファイルに記載されたメタデータとともに、動画を表示することができました。 マニフェストファイルの確認(v2) IIIF Sererモジュールによって生成するマニフェストファイル(v2)を確認したところ、以下のように表示されました。 { "@context": [ "http://iiif.io/api/presentation/2/context.json", "http://wellcomelibrary.org/ld/ixif/0/context.json" ], "@id": "https://omeka-d.aws.ldas.jp/iiif/2/1/manifest", "@type": "sc:Manifest", "label": "mp4", "metadata": [ { "label": "Title", "value": "mp4" } ], "viewingDirection": "left-to-right", "license": "https://rightsstatements.org/vocab/CNE/1.0/", "related": { "@id": "https://omeka-d.aws.ldas.jp/s/test/item/1", "format": "text/html" }, "seeAlso": { "@id": "https://omeka-d.aws.ldas.jp/api/items/1", "format": "application/ld+json" }, "sequences": [ { "@id": "https://omeka-d.aws.ldas.jp/iiif/2/1/sequence/normal", "@type": "sc:Sequence", "label": "Unsupported extension. This manifest is being used as a wrapper for non-IIIF v2 content (e.g., audio, video) and is unfortunately incompatible with IIIF v2 viewers.", "compatibilityHint": "displayIfContentUnsupported", "canvases": [ { "@id": "https://omeka-d.aws.ldas.jp/iiif/ixif-message/canvas/c1", "@type": "sc:Canvas", "label": "Placeholder image", "thumbnail": "https://omeka-d.aws.ldas.jp", "width": null, "height": null, "images": [ { "@id": "https://omeka-d.aws.ldas.jp/iiif/ixif-message/imageanno/placeholder", "@type": "oa:Annotation", "motivation": "sc:painting", "resource": { "@id": "https://omeka-d.aws.ldas.jp/iiif/ixif-message-0/res/placeholder", "@type": "dctypes:Image", "width": null, "height": null }, "on": "https://omeka-d.aws.ldas.jp/iiif/ixif-message/canvas/c1" } ] } ] } ], "mediaSequences": [ { "@id": "https://omeka-d.aws.ldas.jp/iiif/2/1/sequence/s0", "@type": "ixif:MediaSequence", "label": "XSequence 0", "elements": [ { "@id": "https://omeka-d.aws.ldas.jp/files/original/bc5bbd4550ae7b6eab3affbc832bb158b5e280ab.mp4/element/e0", "@type": "dctypes:MovingImage", "label": "mp4", "metadata": [ { "label": "Title", "value": "mp4" } ], "thumbnail": "https://omeka-d.aws.ldas.jp/application/asset/thumbnails/video.png", "rendering": [ { "@id": "https://omeka-d.aws.ldas.jp/files/original/bc5bbd4550ae7b6eab3affbc832bb158b5e280ab.mp4", "format": "video/mp4" } ], "service": { "@id": "https://omeka-d.aws.ldas.jp/iiif/2/5", "profile": "http://wellcomelibrary.org/ld/ixif/0/alpha.json" }, "width": 0, "height": 0 } ] } ] } v2では動画などには非対応のため、mediaSequencesをUniversal Viewerが独自にロードして表示しているようです。 ...

IIIF Curation ListをTEIのfacsimile要素に変換する

IIIF Curation ListをTEIのfacsimile要素に変換する

概要 IIIF Curation ListをTEIのfacsimile要素に変換するライブラリを作成しました。 https://github.com/nakamura196/iiif-tei さらに、この変換を行うデモページを用意しました。 https://nakamura196.github.io/nuxt3-demo/iiif-tei-demo 使い方の動画は以下です。 https://youtu.be/Y5JlrJbtgz8 参考になりましたら幸いです。

CMYKカラーの画像から色を反転させないconvertの方法

CMYKカラーの画像から色を反転させないconvertの方法

概要 例えばIIIFを用いた画像配信において、CMYKカラーの画像に対して、ImageMagickで以下のような変換処理を行うと、色が反転するケースがありました。 convert source_image.tif -alpha off -define tiff:tile-geometry=256x256 -compress jpeg 'ptif:output_image.tif' 元画像 (布LAB.で公開されている画像を利用させていただいています。) Image Annotator(神崎正英氏作成)での表示例 これは、Cantaloupe Image ServerやIIPImageなどのイメージサーバ、および、Image AnnotatorやMirador, Universal Viewerなどのビューア側の問題ではなく、作成されるtiled TIFFs画像に問題があるようです。 本記事では、この問題への対応方法について説明します。 背景 同様の不具合は、以下の記事など、いくつかの場所で報告されていました。 https://scrapbox.io/giraffate/ImageMagickでCMYKのJPG画像を合成したら色が反転するバグ 解決策として、今回は以下を参考にしました。 https://www.imagemagick.org/discourse-server/viewtopic.php?t=32585 -colorspace sRGBを追加するようです。 変換 tiled TIFFsを作成するコマンドは以下を参考にします。 https://samvera.github.io/serverless-iiif/docs/source-images#using-imagemagick 具体的には、以下です。 convert source_image.tif -alpha off -define tiff:tile-geometry=256x256 -compress jpeg 'ptif:output_image.tif' 上記をCMYKカラーの画像に対してそのまま実行すると、冒頭で紹介したように、反転した画像が表示されました。 なお、Image ServerにはCantaloupe Image Serverを使用していますが、IIPImageなどでも同様の事象が確認されました。 修正した変換コマンド 以下のように、-colorspace sRGBを追加します。 convert source_image.tif -alpha off -colorspace sRGB -define tiff:tile-geometry=256x256 -compress jpeg 'ptif:output_image.tif' 結果、以下のように、色が反転せずに、Image AnnotatorなどもIIIF対応ビューアでも表示されるようになりました。 参考 画像表示の確認にあたり、MiradorやUniversal Viewerでは、IIIFマニフェストファイルのURLを入力することが一般的ですが、Image Annotatorでは、画像のURIを入力することができます。 ...

デジタルアーカイブ関連ツールの試作: 主にIIIFの利用支援

デジタルアーカイブ関連ツールの試作: 主にIIIFの利用支援

概要 「デジタルアーカイブ関連ツール」を作成しました。主にIIIF(International Image Interoperability Framework)の利用に関する支援機能を提供します。 https://nakamura196.github.io/viewer/ 機能1: Mirador 3 による画像比較 https://nakamura196.github.io/viewer/input 以下のように、比較したいマニフェストファイルのURLとカンバスのIDを指定します。 結果、以下のように画像を比較することができます。 機能2: コマ数の指定ツール ! IIIF Presentation APIのVersion 2にのみ対応しています。 https://nakamura196.github.io/viewer/canvas いくつかのIIIF対応のビューアでは、manifest引数にマニフェストファイルのURL、canvas引数にカンバスのIDを指定することで、表示するコマ数を指定することができます。 ただし、このカンバスのIDを知るにはマニフェストファイルの中身を確認する必要があり、面倒なことがあります。そこで本機能では、コマ数を指定することで、このカンバスIDを自動的に補完する機能を提供します。 コマ数を指定して「URLを生成」を押すと、カンバスIDが指定されたURLが表示されます。 すべてのビューアに対応していない点に注意が必要ですが、同様のことでお困りの方の参考になりましたら幸いです。 まとめ 参考になりましたら幸いです。

Mirador 3でPresentation API v2のマニフェストが表示できない時の対処例

Mirador 3でPresentation API v2のマニフェストが表示できない時の対処例

概要 以下のようなPresentation API v2のマニフェストファイルをMirador 3にロードした際、表示エラーが生じました。 https://gist.githubusercontent.com/nakamura196/42fb6bca6a9fa137234c334cb313fc58/raw/4188ebccb7406ff5132331a4fecc4ace8bdd7ebc/ng.json 以下、Mirador 3での表示です。 この原因と対処法について調べたので、共有します。 原因 以下のエラーメッセージが表示されていました。IIIF v2を入力しているにもかかわらず、v3と判断されているようでした。 Error: A IIIF v3 localized property value must have an array as the value for a given language. at PropertyValue.ts:126:20 at Array.map (<anonymous>) at t.parse (PropertyValue.ts:123:29) at t.getLabel (ManifestResource.ts:35:28) at canvases.js:162:12 at index.js:67:25 at h (defaultMemoize.js:123:20) at index.js:81:40 at h (defaultMemoize.js:123:20) at Function.mapToProps (OpenSeadragonViewer.js:39:12) これは、以下のように、canvasのlabelがオブジェクトの形で記述されている際に発生するようでした。 canvases": [ { "@id": "https://islamic-architecture.aa-ken.jp/omekas/iiif/2/monument1/canvas/p1", "@type": "sc:Canvas", "label": { "type": "literal", "property_id": 1, "property_label": "Title", "is_public": true, "@value": "0001-01" }, ... } ] なお、上記の記述方法は、Presentation API ValidatorではOKでした。 ...

Omeka SのモジュールIIIF Viewersの更新

Omeka SのモジュールIIIF Viewersの更新

概要 IIIF ViewersはOmeka Sのモジュールの一つです。 https://github.com/omeka-j/Omeka-S-module-IiifViewers 最新版のリリースは以下です。 https://github.com/omeka-j/Omeka-S-module-IiifViewers/releases/latest 今回、いくつかの更新を行いましたので、備忘録です。 Universal Viewerのバージョン更新 Universal Viewerのバージョンをv4.0.25に更新しました。 合わせて、READEME.mdの以下の箇所に、Universal Viewerの更新方法を記載しました。 https://github.com/omeka-j/Omeka-S-module-IiifViewers?tab=readme-ov-file#compilation-of-universal-viewer これは、以下のモジュールの記載を参考にしています。 https://github.com/Daniel-KM/Omeka-S-module-UniversalViewer また、Miradorの更新方法も記載しましたが、既に最新版が導入されていたので、更新は行われていません。 バグ修正 以下に加えて、細かなバグを修正しました。 Module.php 以下のエラーが生じていました。 Deprecated: Creation of dynamic property IiifViewers\Module::$dependencies is deprecated in /var/www/html/modules/IiifViewers/Module.php on line 147 以下のように修正しました。 namespace IiifViewers; use Omeka\Module\AbstractModule; use IiifViewers\Form\ConfigForm; use Laminas\Mvc\Controller\AbstractController; use Laminas\EventManager\Event; use Laminas\EventManager\SharedEventManagerInterface; use Laminas\Mvc\MvcEvent; use Laminas\View\Renderer\PhpRenderer; use Laminas\ServiceManager\ServiceLocatorInterface; use Omeka\Module\Exception\ModuleCannotInstallException; use Omeka\Stdlib\Message; class Module extends AbstractModule { protected $dependencies = []; // Define the property at the beginning // Rest of your code... iiif-viewers.phtml 以下のWarningが生じていたので、いずれも修正しました。 ...

Next.jsを用いたTEI/XMLファイルの簡易ビューアを作成しました

Next.jsを用いたTEI/XMLファイルの簡易ビューアを作成しました

概要 TEI/XMLファイルの内容を表示する簡易なビューアを作成しました。 https://github.com/utda/tei-viewer 校異源氏物語のTEI/XMLを対象とした表示例は以下です。 https://utda.github.io/tei-viewer/?u=https://kouigenjimonogatari.github.io/tei/01.xml&v=true 使い方 最低限の機能として、IIIFマニフェストファイルが関連付けられている場合には、Miradorビューアが表示されるようにしました。関連付けの方法としては、以下のフォーマットをベースとしています。 https://github.com/TEI-EAJ/jp_guidelines/wiki/IIIF画像とのリンク またpbタグのn属性が与えられている場合は、ページ番号が表示される機能を提供します。さらに日本語への対応として、クエリパラメータにv=trueを与えた場合、縦書きテキストが表示されます。 https://github.com/utda/tei-viewer/blob/main/src/app/components/Ceteicean.tsx その他 フレームワークにはNext.js、TEI/XMLの表示スタイルにはCETEICeanを使用しました。 https://github.com/utda/tei-viewer/blob/main/src/app/CETEIcean.css そのほか、以下の記事を参考に、GitHubリポジトリとZenodoの連携を試行しています。 改善の余地があるかと思いますが、以下のコマンドを使って、新しいリリースを作成しています。 "release": "npm version patch && git push origin --tags && VERSION=$(node -pe \"require('./package.json').version\") && gh release create \"v$VERSION\" --title \"Version $VERSION\"" 今後 pbタグとMiradorビューアの画像表示が対応する機能を追加したいと思います。 まとめ TEI/XMLファイルの可視化にあたり、参考になりましたら幸いです。

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

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取得にあたり、参考になりましたら幸いです。

Docker版Cantaloupeを使用して、S3バケットにアクセスしSSL通信を行う方法

Docker版Cantaloupeを使用して、S3バケットにアクセスしSSL通信を行う方法

概要 Docker版のCantaloupeの使い方を以下で紹介しました。 このDocker版Cantaloupeを(大規模ではない)production環境で使用するには、Amazon S3との接続や、SSL対応が求められます。その方法を一例を紹介します。 Amazon S3との接続 公式では以下で紹介されています。 https://cantaloupe-project.github.io/manual/5.0/sources.html#S3Source 日本語の記事として以下があります。 また、今回扱うDocker版では、以下に記載がありました。 https://github.com/Islandora-Devops/isle-buildkit/blob/main/cantaloupe/README.md#settings そこで、S3と最低限の接続を行うためのリポジトリを作成しました。 https://github.com/nakamura196/docker_cantaloupe_s3 .env.exampleを.envにリネームまたはコピーして、必要な値を入力します。 SSL対応 以下の記事を参考にしました。EC2上にDockerをインストールし、nginx-proxyとnginx-proxy-lets-encryptを利用してSSL化を行いました。 https://qiita.com/atsuya/items/7cb6e0ccee63d751d41f version: '3' # proxy services: nginx-proxy: image: jwilder/nginx-proxy container_name: nginx-proxy ports: - "80:80" - "443:443" volumes: - html:/usr/share/nginx/html - dhparam:/etc/nginx/dhparam - vhost:/etc/nginx/vhost.d - certs:/etc/nginx/certs:ro - /var/run/docker.sock:/tmp/docker.sock:ro - /srv/docker/nginx-proxy-with-encrypt/log:/var/log/nginx labels: - "com.github.jrcs.letsencrypt_nginx_proxy_companion.nginx_proxy" restart: always letsencrypt: image: jrcs/letsencrypt-nginx-proxy-companion container_name: nginx-proxy-lets-encrypt depends_on: - "nginx-proxy" volumes: - certs:/etc/nginx/certs:rw - vhost:/etc/nginx/vhost.d - html:/usr/share/nginx/html - /var/run/docker.sock:/var/run/docker.sock:ro volumes: certs: html: vhost: dhparam: networks: default: external: name: common_link services: cantaloupe: image: islandora/cantaloupe:2.0.10 environment: CANTALOUPE_ENDPOINT_ADMIN_ENABLED: false CANTALOUPE_ENDPOINT_ADMIN_SECRET: my_admin_pass CANTALOUPE_SOURCE_STATIC: S3Source CANTALOUPE_S3SOURCE_ACCESS_KEY_ID: ${CANTALOUPE_S3SOURCE_ACCESS_KEY_ID} CANTALOUPE_S3SOURCE_SECRET_KEY: ${CANTALOUPE_S3SOURCE_SECRET_KEY} CANTALOUPE_S3SOURCE_REGION: ${CANTALOUPE_S3SOURCE_REGION} CANTALOUPE_S3SOURCE_BASICLOOKUPSTRATEGY_BUCKET_NAME: ${CANTALOUPE_S3SOURCE_BASICLOOKUPSTRATEGY_BUCKET_NAME} CANTALOUPE_S3SOURCE_LOOKUP_STRATEGY: BasicLookupStrategy # Or another strategy if needed VIRTUAL_HOST: <カスタムドメイン> LETSENCRYPT_HOST: <カスタムドメイン> LETSENCRYPT_EMAIL: <メールアドレス> restart: always networks: default: external: name: common_link まとめ IIIF画像サーバの小中規模の利用にあたっては、上記のような形が比較的容易な導入方法の一つに当たるかと思います。 ...

Docker版のCantaloupeを試す

Docker版のCantaloupeを試す

概要 TEI PublisherのDocker版を試していたところ、docker版のcantaloupeが使用されていたので、それを単体で使用できるリポジトリを作成しました。 https://github.com/nakamura196/docker_cantaloupe 使用方法は上記リポジトリのREADMEに記載しております。 以下のDocker imageを使用しています。 https://hub.docker.com/r/islandora/cantaloupe 参考:Cantaloupeで配信可能な画像 以下のページで説明されています。 https://cantaloupe-project.github.io/manual/5.0/images.html 高解像度の画像については、JPEG2000またはTIFFのPyramidal Tiledが推奨されています。 一方、解像度が比較的小さい画像の場合は、JPEGやPNGファイルをそのまま配信できるようでした。 http://localhost:8182/iiif/2/baby_role_towel_utsubuse.png/200,200,200,200/full/0/default.jpg (いらすやの画像を使用しています。) iiifというフォルダに画像を格納するだけで、IIIF Image APIの挙動を確認することができます。 まとめ CantaloupeやIIIF Image APIの挙動の確認にあたり、参考になりましたら幸いです。

Allmapsを使ってジオリファレンスを行う

Allmapsを使ってジオリファレンスを行う

概要 今回は、Allmapsを使ったジオリファレンスを試します。 https://allmaps.org/ Allmapsは以下のように説明されています。 Allmaps makes it easier and more inspiring to curate, georeference and explore collections of digitized maps. (機械翻訳) Allmaps を使用すると、デジタル化された地図のコレクションを整理、地理参照、探索することがより簡単かつ刺激的になります。 今回は、「東京大学農学生命科学図書館」が所蔵する「東京帝國大學本部構内及農學部建物鳥瞰圖」を使用します。 https://da.dl.itc.u-tokyo.ac.jp/portal/assets/187cc82d-11e6-9912-9dd4-b4cca9b10970 以下のような成果物を作成します。 https://viewer.allmaps.org/?url=https%3A%2F%2Fannotations.allmaps.org%2Fimages%2F2e1d3f991aad6cb4 https://www.youtube.com/watch?v=G0CcXfqo6rs 方法 以下にアクセスします。 https://editor.allmaps.org/#/ 今回は、2枚目の画像を使用するので、以下のURLをフォームに入力します。 https://iiif.dl.itc.u-tokyo.ac.jp/iiif/agriculture_re/nou_tatemonochokanzu/0002.tif 以下のようなページで、「Georeference」ボタンを押します。 以下のように、画像と地図が並列に表示されるページに遷移します。画像と地図で対応する箇所をポイントしていきます。 その後、「Results」ボタンを押して、以下の「View current image」リンクをクリックします。 結果、以下のようなビューアのページに遷移します。 作成されるデータ Editor画面で、作成されるJSONデータをコピー、またはダウンロードすることができます。以下のようなJSONデータが作成されました。 { "type": "AnnotationPage", "@context": [ "http://www.w3.org/ns/anno.jsonld" ], "items": [ { "id": "75912f7214324ea9", "type": "Annotation", "@context": [ "http://www.w3.org/ns/anno.jsonld", "http://geojson.org/geojson-ld/geojson-context.jsonld", "http://iiif.io/api/presentation/3/context.json" ], "motivation": "georeferencing", "target": { "type": "Image", "source": "https://iiif.dl.itc.u-tokyo.ac.jp/iiif/2/agriculture_re%2Fnou_tatemonochokanzu%2F0002.tif/full/full/0/default.jpg", "service": [ { "@id": "https://iiif.dl.itc.u-tokyo.ac.jp/iiif/2/agriculture_re%2Fnou_tatemonochokanzu%2F0002.tif", "type": "ImageService2" } ], "selector": { "type": "SvgSelector", "value": "<svg width=\"18415\" height=\"12911\"><polygon points=\"0,0 0,12911 18415,12911 18415,0\" /></svg>" } }, "body": { "type": "FeatureCollection", "purpose": "gcp-georeferencing", "transformation": { "type": "polynomial", "order": 0 }, "features": [ { "type": "Feature", "properties": { "pixelCoords": [ 6690, 7517 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7623182, 35.7151233 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 8846, 9181 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7612649, 35.7129321 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 11626, 8624 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7622949, 35.7109037 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 12761, 9476 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7618816, 35.7097492 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 7540, 8365 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7618343, 35.7143244 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 10681, 5983 ] }, "geometry": { "type": "Point", "coordinates": [ 139.764372, 35.7123118 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 9304, 5659 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7645652, 35.7135689 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 3826, 10219 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7594158, 35.7166753 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 8044, 9859 ] }, "geometry": { "type": "Point", "coordinates": [ 139.76062, 35.7134203 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 10517, 7862 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7627108, 35.7121183 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 8892, 9831 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7607901, 35.7126873 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 14667, 9708 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7620234, 35.7081704 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 2354, 8506 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7608678, 35.7184833 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 10054, 8713 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7620034, 35.7122089 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 5594, 10678 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7593041, 35.7151585 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 13028, 6647 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7642327, 35.7102509 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 10685, 10444 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7605725, 35.7111428 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 4438, 9181 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7606565, 35.7165095 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 8840, 10491 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7602447, 35.7126024 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 4667, 10202 ] }, "geometry": { "type": "Point", "coordinates": [ 139.759576, 35.7159457 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 6762, 10060 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7600401, 35.7144106 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 8587, 8135 ] }, "geometry": { "type": "Point", "coordinates": [ 139.762299, 35.7134381 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 7967, 10465 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7600601, 35.7133129 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 6466, 8313 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7616346, 35.7150937 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 7569, 7471 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7625263, 35.7143713 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 10111, 10099 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7607835, 35.7116287 ] } }, { "type": "Feature", "properties": { "pixelCoords": [ 12606, 10162 ] }, "geometry": { "type": "Point", "coordinates": [ 139.7611825, 35.7096128 ] } } ] } } ] } まとめ IIIF対応画像に対するジオリファレンスを行うにあたり、参考になりましたら幸いです。 ...

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

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 参考になりましたら幸いです。

Cantaloupe: サービスとして実行する

Cantaloupe: サービスとして実行する

概要 Cantaloupe Image Serverは以下のコマンドで実行できます。 java -Dcantaloupe.config=cantaloupe.properties -Xmx2g -jar cantaloupe-5.0.5.jar しかしこの方法では、ssh接続が切れた場合など、Cantaloupeサーバが止まってしまいます。 そこで、サービスとして実行する方法を紹介します。 方法 サービスファイルの作成 : /etc/systemd/system/ディレクトリにサービスファイル(例えば、cantaloupe.service)をsudo権限で作成します。 [Unit] Description=Cantaloupe Image Server [Service] User=ubuntu # 以下のパスは適宜修正してください WorkingDirectory=/home/ubuntu/cantaloupe-5.0.5 ExecStart=/usr/bin/java -Dcantaloupe.config=cantaloupe.properties -Xmx2g -jar cantaloupe-5.0.5.jar SuccessExitStatus=143 [Install] WantedBy=multi-user.target このファイルでは、ExecStartに実行するJavaコマンドを指定します。また、UserとWorkingDirectoryは適切に設定する必要があります。 サービスのリロード : 変更を適用するために、次のコマンドでsystemdをリロードします。 sudo systemctl daemon-reload サービスの開始 : 以下のコマンドでサービスを開始します。 sudo systemctl start cantaloupe サービスの有効化 : システム起動時にサービスが自動的に起動するようにするには、以下のコマンドを実行します。 sudo systemctl enable cantaloupe サービスの状態確認 : サービスの状態を確認するには、次のコマンドを使用します。 sudo systemctl status cantaloupe 注意: この例では、Javaのパスやcantaloupeのインストールパスは適宜修正する必要があります。また、Userはcantaloupeを実行するユーザーに置き換えてください。サービスファイルの詳細設定については、systemdのドキュメントを参照してください。 まとめ 以下のようにサービスとして起動していることを確認できます。参考になりましたら幸いです。 sudo systemctl status cantaloupe ● cantaloupe.service - Cantaloupe Image Server Loaded: loaded (/etc/systemd/system/cantaloupe.service; enabled; vendor preset: enabled) Active: active (running) since Thu 2023-11-16 03:52:24 UTC; 6min ago Main PID: 33204 (java) Tasks: 31 (limit: 4667) Memory: 116.2M CPU: 4.408s CGroup: /system.slice/cantaloupe.service └─33204 /usr/bin/java -Dcantaloupe.config=cantaloupe.properties -Xmx2g -jar cantaloupe-5.0.5.jar

Cantaloupe: Amazon S3に格納した画像を配信する

Cantaloupe: Amazon S3に格納した画像を配信する

概要 IIIFイメージサーバの一つであるCantaloupe Image Serverについて、Amazon S3に格納した画像を配信する方法の備忘録です。 なお、Amazon S3に格納した画像を配信する別の方法として、以下の記事で紹介した方法もありますので、参考になりましたら幸いです。(記事執筆時点からツールが更新されているようで、記事通りに進められないかもしれません。) 設定 以下に公式マニュアルが公開されています。 https://cantaloupe-project.github.io/manual/5.0/sources.html#S3Source 以下のファイルを編集します。 /cantaloupe-5.0.5/cantaloupe.properties まず、source.staticをS3Sourceに変更しました。 ########################################################################### # SOURCES ########################################################################### # Uses one source for all requests. Available values are `FilesystemSource`, # `HttpSource`, `JdbcSource`, `S3Source`, and `AzureStorageSource`. # source.static = FilesystemSource source.static = S3Source 次に、S3Source.access_key_id、S3Source.secret_key、S3Source.BasicLookupStrategy.bucket.nameを設定します。 #---------------------------------------- # S3Source #---------------------------------------- # !! Endpoint URI. Only needed for non-AWS endpoints. S3Source.endpoint = # !! AWS region. Only needed for AWS endpoints. S3Source.region = # !! Credentials for your AWS account. # See: http://aws.amazon.com/security-credentials # Note that this info can be obtained from elsewhere rather than setting # it here; see the user manual. S3Source.access_key_id = <アクセスキー> S3Source.secret_key = <シークレットキー> # How to look up objects. Allowed values are `BasicLookupStrategy` and # `ScriptLookupStrategy`. ScriptLookupStrategy uses a delegate method for # dynamic lookups; see the user manual. S3Source.lookup_strategy = BasicLookupStrategy # !! Name of the bucket containing images to be served. S3Source.BasicLookupStrategy.bucket.name = <バケット名> これでAmazon S3に格納した画像が参照されるようになりました。 ...

フリーハンドのアノテーションを矩形に変換するPythonライブラリを作成しました。

フリーハンドのアノテーションを矩形に変換するPythonライブラリを作成しました。

フリーハンドのアノテーションを矩形に変換するPythonライブラリを作成しました。 以下のようなフリーハンドで作成したアノテーションを入力として、 以下のような矩形のアノテーションに変換します。 『田中芳男・博物学コレクション』(東京大学総合図書館所蔵)を使用しています。 具体的な使用方法は、以下のノートブックをご確認ください。 https://github.com/nakamura196/000_tools/blob/main/フリーハンドのアノテーションを矩形に変換する.ipynb IIIFのアノテーションの活用にあたり、参考になりましたら幸いです。

IIIF Content State APIを試す

IIIF Content State APIを試す

概要 IIIF Content State APIを試す機会がありましたので、その備忘録です。 https://iiif.io/api/content-state/1.0/ IIIF Content State APIはカレントアウェアネス-Rで以下のように説明されています。 “IIIF Content State API”は、回転角度やページ画像上の表示箇所等、オブジェクトの表示を詳細に指定したリンクを生成できると述べられています。 https://current.ndl.go.jp/car/45832 試す 「秀英体・活版印刷デジタルライブラリー」がIIIF Content State APIを提供してくださっています。 https://archives.ichigaya-letterpress.jp/library/ 以下に記載があります。 https://archives.ichigaya-letterpress.jp/library/help 以下、利用例について説明します。 アイテムの詳細画面 例えば、以下のページにアクセスします。 https://archives.ichigaya-letterpress.jp/library/items/084cef1f7ddc そして、IIIF Curation Viewerへのリンクをクリックします。 矩形の選択 IIIF Curation Viewerを使って、矩形を選択します。 IIIF Curation Viewerの使い方については、以下を参考にしてください。 http://ch-suzuki.com/icpt/index.html 少し手順を省きますが、以下の情報を取得できます。 https://archives.ichigaya-letterpress.jp/api/presentation/2/084cef1f7ddc/canvas/2#xywh=2148,813,312,304 上記は以下の形式になっています。 <資料のキャンバスURI>#xywh=<画像のX座標>,<画像のY座標>,<画像の幅>,<画像の高さ> base64エンコード 例えば、以下のサイトにアクセスします。 https://www.base64encode.org/ そして、先に取得した情報と当該アイテムのマニフェストURIを使って、以下のJSONをエンコードします。 { "id": "https://archives.ichigaya-letterpress.jp/api/presentation/2/084cef1f7ddc/canvas/2#xywh=2148,813,312,304", "type": "Canvas", "partOf": [{ "id": "https://archives.ichigaya-letterpress.jp/api/presentation/2/084cef1f7ddc/manifest.json", "type": "Manifest" }] } 結果、以下の文字列が得られます。 ewogICAgImlkIjogImh0dHBzOi8vYXJjaGl2ZXMuaWNoaWdheWEtbGV0dGVycHJlc3MuanAvYXBpL3ByZXNlbnRhdGlvbi8yLzA4NGNlZjFmN2RkYy9jYW52YXMvMiN4eXdoPTIxNDgsODEzLDMxMiwzMDQiLAogICAgInR5cGUiOiAiQ2FudmFzIiwKICAgICJwYXJ0T2YiOiBbewogICAgICAgICJpZCI6ICJodHRwczovL2FyY2hpdmVzLmljaGlnYXlhLWxldHRlcnByZXNzLmpwL2FwaS9wcmVzZW50YXRpb24vMi8wODRjZWYxZjdkZGMvbWFuaWZlc3QuanNvbiIsCiAgICAgICAgInR5cGUiOiAiTWFuaWZlc3QiCiAgICB9XQp9 エンドポイントURLにアクセス 上記の文字列を使って、以下のURLにアクセスしてみます。 https://archives.ichigaya-letterpress.jp/library/items/084cef1f7ddc?target=ewogICAgImlkIjogImh0dHBzOi8vYXJjaGl2ZXMuaWNoaWdheWEtbGV0dGVycHJlc3MuanAvYXBpL3ByZXNlbnRhdGlvbi8yLzA4NGNlZjFmN2RkYy9jYW52YXMvMiN4eXdoPTIxNDgsODEzLDMxMiwzMDQiLAogICAgInR5cGUiOiAiQ2FudmFzIiwKICAgICJwYXJ0T2YiOiBbewogICAgICAgICJpZCI6ICJodHRwczovL2FyY2hpdmVzLmljaGlnYXlhLWxldHRlcnByZXNzLmpwL2FwaS9wcmVzZW50YXRpb24vMi8wODRjZWYxZjdkZGMvbWFuaWZlc3QuanNvbiIsCiAgICAgICAgInR5cGUiOiAiTWFuaWZlc3QiCiAgICB9XQp9 結果、以下のページにアクセスできます。 まとめ IIIF Content State APIの目的の通り、オブジェクトの表示を詳細に指定したリンクを作成することができました。 リンクの作成については、より効率的な方法があるかと思いますが、参考になりましたら幸いです。 ...