Tech | デジタルアーカイブシステムの技術ブログ

Google Colabを用いたndl-lab図表自動抽出プログラムの実行

概要 ndl-labでは、以下の図表自動抽出プログラムが公開されています。 https://github.com/ndl-lab/tensorflow-deeplab-v3-plus 今回は上記のプログラムについて、Google Driveを用いた画像の入力と結果の保存までの手続きを含むGoogle Colabの使用方法をまとめましたので紹介します。ノートブック今回作成したGoogle Colabのノートブックには以下からアクセスいただけます。 https://colab.research.google.com/github/nakamura196/ndl_ocr/blob/main/ndl_deeplab.ipynb Googleドライブ上に入力画像のフォルダを用意することで、図表の自動抽出処理を実行することができます。基本的な操作方法は、上記のノートブック内の説明をご確認ください。以下、実行例を紹介します。本ノートブックでは、（1）入力フォルダを準備する方法と、（2）IIIFマニフェストファイルのURLを入力する方法の2つがあります。それぞれについて説明します。実行方法：（１）入力フォルダの準備入力フォルダの準備まず、Google Drive上に画像ファイルを格納したフォルダを作成します。今回は、以下のように、マイドライブに「ndl_deeplab > input」というフォルダを作成して、その直下に画像ファイルを格納しました。ノートブックの実行：1.初期セットアップ先に示した以下のノートブックにアクセスしてください。 https://colab.research.google.com/github/nakamura196/ndl_ocr/blob/main/ndl_deeplab.ipynb そして、用意されている2つの再生ボタンを押してください。少し時間がかかりますが、必要なライブラリ等をインストールします。また、本作業については、ノートブック立ち上げ後の初回のみ実行します。ノートブックの実行：2.設定次に、処理の適用対象を設定します。以下のように、input_dirに先に用意したフォルダへのパスを指定します。またmanifestの値を空にしてください。これにより、input_dirに格納した画像ファイルを対象に処理を実行します。再生ボタンを押して、設定は完了です。ノートブックの実行：3.実行「3.実行」の再生ボタンを押してください。完了後は、以下のように、指定した出力フォルダに処理の開始時間に基づくフォルダが作成され、その中に認識結果が保存されます。図表の抽出に失敗してしまう場合もありますが、今回は以下のように、正しく図表を抽出することができました。実行方法：（2）IIIFマニフェストファイルのURLを入力するノートブックの実行：1.初期セットアップこれは先ほどのプロセスと同じです。2回目以降はスキップしてください。ノートブックの実行：2.設定以下のように、manifestに処理対象とするIIIFマニフェストファイルのURLを入力してください。またprocess_sizeに処理対象のcanvas数を指定します。-1を入力すると、マニフェストファイルに含まれるすべてのcanvas（画像）に対して処理を実行します。再生ボタンを押して、設定は完了です。ノートブックの実行：3.実行「3.実行」の再生ボタンを押してください。今回の場合、以下のように、まず画像のダウンロードが行われます。 ### マニフェストが指定されている場合は、画像のダウンロード ### 80%|████████ | 4/5 [00:13<00:03, 3.41s/it] その後、抽出処理が始まります。処理対象の画像が多い場合、完了まで時間がかかります。抽出処理の完了後、「実行方法：（１）入力フォルダの準備」で示した通り、指定したGoogleドライブ上の出力フォルダに認識結果が保存されるほか、以下のように、認識結果をIIIFマニフェストファイルの形で出力し、それをMiradorビューアで閲覧するためのURLが表示されます。 ### マニフェストが指定されている場合は、認識結果をマニフェストファイルに出力 ### /content/drive/MyDrive/ndl_deeplab/output/20220429095851/manifest.json にマニフェストファイルを保存しました。また以下のリンクから、認識結果を確認できます。 https://localhost:8000/ 上記のリンクをクリックすると、以下のように、Miradorを用いて認識結果を確認することができます。まとめ今回は、NDLラボが公開する図表自動抽出プログラムについて、Google Colabを用いた実行方法の一例を示しました。他の方の参考になりましたら幸いです。このようなアプリケーションを公開してくださったNDLの関係者の方々に深く感謝いたします。

2022年4月29日 · 更新: 2022年4月29日 · 1 分 · Nakamura

Google Colabを用いたNDLOCRアプリの実行（Google Driveを用いた画像の入力と結果の保存）

概要前回、Google Cloud PlatformのCompute Engineを用いたNDLOCRアプリの実行方法を共有しました。ただし、上記の方法は手続きが一部面倒で、かつ費用がかかる方法です。本番環境で使用するには適した方法ですが、小規模に、または試験的に使用するにはハードルが高い方法でした。この課題に対して、 @blue0620 さんがGoogle Colabを用いたNDLOCRアプリの実行方法を作成されました。 https://twitter.com/blue0620/status/1519294332159012864 上記のノートブックを使用することにより、簡単に（「ランタイム」>「すべてのセルを実行」からワンクリックで）、かつ無料でOCRを実行することができます。今回は、このノートブックを参考にして、Google Driveを用いた画像の入力と結果の保存までの手続きを含むGoogle Colabの使用方法をまとめましたので紹介します。ノートブック今回作成したGoogle Colabのノートブックには以下からアクセスいただけます。 https://colab.research.google.com/github/nakamura196/ndl_ocr/blob/main/ndl_ocr_folder.ipynb Googleドライブ上に入力画像のフォルダを用意するだけで、OCR処理を実行することができます。基本的な操作方法は、上記のノートブック内の説明をご確認ください。以下、実行例を紹介します。実行方法入力フォルダの準備まず、Google Drive上に画像ファイルを格納したフォルダを作成します。今回は、以下のように、マイドライブに「ndl_ocr > input」というフォルダを作成して、その直下に画像ファイル「image_1.jpg」とフォルダ「dir_1」を作成し、フォルダ「dir1」の中に画像ファイル「image_2.jpeg」を格納しました。ツリーで見ると、以下のような形です。今回作成したプログラムでは、指定した入力フォルダに含まれる画像を再帰的に探索します。ノートブックの実行：1.初期セットアップ先に示した以下のノートブックにアクセスしてください。 https://colab.research.google.com/github/nakamura196/ndl_ocr/blob/main/ndl_ocr_folder.ipynb そして、以下に示す再生ボタンを押してください。少し時間がかかりますが、必要なライブラリ等をインストールします。また、本作業については、ノートブック立ち上げ後の初回のみ実行します。再生ボタンを押した後、「このノートブックに Google ドライブのファイルへのアクセスを許可しますか？」と聞かれるので、「Google ドライブに接続」を押して、許可してください。その後、しばらくの間、再生中のボタンが表示されます。これが完了したら、次のステップに進みます。ノートブックの実行：2.設定次に、OCR処理の適用対象を設定します。入力フォルダ（input_dir）は、上述した「/content/drive/MyDrive/ndl_ocr/input/」としました。出力フォルダ（output_dir）は、「/content/drive/MyDrive/ndl_ocr/output/」としました。このフォルダは事前に作成しておかなくてもかまいません。拡張子（extensions）は、今回は拡張子がjpgとjpegの画像を格納したので、これら二つを設定します。 processは、以下を参考にしてください。 https://github.com/ndl-lab/ndlocr_cli#推論処理の実行ノートブックの実行：3.実行「3.実行」の再生ボタンを押してください。再生ボタンを押した後、以下のように、再生中ボタンが表示されます。完了後は、以下のように、指定した出力フォルダに認識結果が保存されます。入力フォルダの構造を維持する形で出力するようにしています。また、設定において選択したprocessの値をフォルダ名に付与しています。processの値を変えて実行した際、それぞれの出力フォルダが残るようにしています。以下のように、Googleドライブ上で認識結果の保存と確認が可能です。まとめ上記の方法により、Googleドライブ上に格納した画像に対するOCR処理と、その結果の保存を無料で行うことができます。保存した結果を、さまざまな用途に活用することができます。 Google Colabを利用した実行方法を示してくださった @blue0620 さんに感謝いたします。追記 2022.05.02 本ノートブックの改良版であるVersion 2を作成しました。以下の記事も参考にしてください。 ...

2022年4月28日 · 更新: 2022年4月28日 · 1 分 · Nakamura

Amazon Lightsailを用いたOmeka Sサイトの構築（独自ドメイン+SSL化を含む）

概要 Amazon Lightsail インスタンスの作成インスタンス内での作業ファイルの移動データベースの作成 Omeka Sの設定ブラウザでの設定独自ドメインの付与静的IPアドレスの付与 Route 53 SSL化（参考）Basic認証まとめ概要 Amazon Lightsailは以下のような説明がなされています。 Amazon Lightsail は、コンテナなどのクラウドリソースを予測可能な低価格で簡単に管理できる、使いやすい仮想プライベートサーバー (VPS) です。今回は、このAmazon Lightsailを用いたOmeka Sの構築方法を紹介します。合わせて、データベースの公開にあたり一般的に求められる「独自ドメイン」「SSL」設定についても扱います。 Amazon Lightsail インスタンスの作成以下のページにアクセスします。 https://lightsail.aws.amazon.com/ls/webapp/home/instances そして、以下の「Create Instance」ボタンをクリックします。「Select a blueprint」において、「LAMP (PHP 7)」を選択します。「Choose your instance plan」において、インスタンスプランを選択します。今回は最も低価格のプランを選びました。起動したら、以下のインスタンスのページにアクセスして、「Connect using SSH」ボタンを押します。以下の画面が表示されます。 Linux ip-172-26-5-202 4.19.0-19-cloud-amd64 #1 SMP Debian 4.19.232-1 (2022-03-07) x86_64 The programs included with the Debian GNU/Linux system are free software; the exact distribution terms for each program are described in the individual files in /usr/share/doc/*/copyright. Debian GNU/Linux comes with ABSOLUTELY NO WARRANTY, to the extent permitted by applicable law. ___ _ _ _ | _ |_) |_ _ _ __ _ _ __ (_) | _ \ | _| ' \/ _` | ' \| | |___/_|\__|_|_|\__,_|_|_|_|_| *** Welcome to the LAMP packaged by Bitnami 7.4.28-14 *** *** Documentation: https://docs.bitnami.com/aws/infrastructure/lamp/ *** *** https://docs.bitnami.com/aws/ *** *** Bitnami Forums: https://community.bitnami.com/ *** bitnami@ip-172-26-5-202:~$ インスタンス内での作業ファイルの移動まず、必要なファイルのダウンロードや移動を行います。 ...

2022年4月26日 · 2 分 · Nakamura

Amazon Lightsailを用いたOmeka Sサイトの構築（独自ドメイン+SSL化を含む）

更新履歴 2022/09/08 スクリプトの記述を最新化しました。概要 Amazon Lightsailは以下のような説明がなされています。 Amazon Lightsail は、コンテナなどのクラウドリソースを予測可能な低価格で簡単に管理できる、使いやすい仮想プライベートサーバー (VPS) です。今回は、このAmazon Lightsailを用いたOmeka Sの構築方法を紹介します。合わせて、データベースの公開にあたり一般的に求められる「独自ドメイン」「SSL」設定についても扱います。 Amazon Lightsail インスタンスの作成以下のページにアクセスします。 https://lightsail.aws.amazon.com/ls/webapp/home/instances そして、以下の「Create Instance」ボタンをクリックします。「Select a blueprint」において、「LAMP (PHP 7)」を選択します。「Choose your instance plan」において、インスタンスプランを選択します。今回は最も低価格のプランを選びました。起動したら、以下のインスタンスのページにアクセスして、「Connect using SSH」ボタンを押します。以下の画面が表示されます。 Linux ip-172-26-5-202 4.19.0-19-cloud-amd64 #1 SMP Debian 4.19.232-1 (2022-03-07) x86_64 The programs included with the Debian GNU/Linux system are free software; the exact distribution terms for each program are described in the individual files in /usr/share/doc/*/copyright. Debian GNU/Linux comes with ABSOLUTELY NO WARRANTY, to the extent permitted by applicable law. ___ _ _ _ | _ |_) |_ _ _ __ _ _ __ (_) | _ \ | _| ' \/ _` | ' \| | |___/_|\__|_|_|\__,_|_|_|_|_| *** Welcome to the LAMP packaged by Bitnami 7.4.28-14 *** *** Documentation: https://docs.bitnami.com/aws/infrastructure/lamp/ *** *** https://docs.bitnami.com/aws/ *** *** Bitnami Forums: https://community.bitnami.com/ *** bitnami@ip-172-26-5-202:~$ インスタンス内での作業ファイルの移動まず、必要なファイルのダウンロードや移動を行います。 ...

2022年4月26日 · 更新: 2022年4月26日 · 2 分 · Nakamura

Google Cloud PlatformのCompute Engineを用いたNDLOCRアプリの実行

概要 NDLが公開したNDLOCRアプリケーションについて、GCP（Google Cloud Platform）の仮想マシンを用いて実行してみましたので、その備忘録です。本アプリケーションの詳細については、以下のリポジトリをご確認ください。 https://github.com/ndl-lab/ndlocr_cli VMインスタンスの作成 GCPのCompute Engineにアクセスして、画面上部の「インスタンスを作成」ボタンをクリックします。「マシンの構成」の「マシンファミリー」について、「GPU」を選択します。そして「GPUのタイプ」において、今回は最も安価な「NVIDIA T4」を選択します。「GPUの数」は1に設定しました。「シリーズ」については、「n1-standard-2」を選択します。「n1-standard-1」では、以下のようにMemoryErrorが発生してしまいました。次に、「ブートディスク」において、「イメージの切り替え」を選択します。そして推奨された「Deep Learning on Linux」を選択します。この時の注意点として、「サイズ」をデフォルトの50GBから、100GBに変更しました。50GBの場合、no space leftが発生しました。以下は、環境構築が済んだ後の情報ですが、40GB強が使用済みとなるため、余裕を持った「サイズ」にしておくことをお勧めします。 u_nakamura_satoru@instance-4:~$ df -h Filesystem Size Used Avail Use% Mounted on udev 7.4G 0 7.4G 0% /dev tmpfs 1.5G 8.4M 1.5G 1% /run /dev/sda1 492G 41G 432G 9% / tmpfs 7.4G 0 7.4G 0% /dev/shm tmpfs 5.0M 0 5.0M 0% /run/lock tmpfs 7.4G 0 7.4G 0% /sys/fs/cgroup /dev/sda15 124M 5.7M 119M 5% /boot/efi tmpfs 1.5G 0 1.5G 0% /run/user/1001 その後、画面下部の「作成」ボタンを押してVMインスタンスの作成を完了します。 ...

2022年4月26日 · 更新: 2022年4月26日 · 5 分 · Nakamura

The New York Public LibraryのAPIを使ってみる

概要 The New York Public Libraryでは、Digital Collections APIを提供しています。 http://api.repo.nypl.org/ 本記事では、このAPIの使い方の一例について説明します。サインアップまず以下のリンクをクリックして、サインアップを行います。以下のようなフォームが表示されますので、必要な情報を入力します。入力後、 Welcome to NYPL API という件名のメールが届きます。このメールの中に、 Authentication Token が記載されています。メタデータの抽出 The New York Public Library Digital Collections APIではさまざまなendpointが提供されています。今回は以下のendpointを利用して、各アイテムのメタデータを抽出してみます。 http://api.repo.nypl.org/api/v1/items/item_details/[:id] 具体的には、以下のアイテムを例としてます。 https://digitalcollections.nypl.org/items/510d47e1-d3b0-a3d9-e040-e00a18064a99 そして、以下に示したメタデータの抽出を試みます。以下のGoogle Colabにメタデータの抽出サンプルプログラムを作成しました。参考になりましたら幸いです。 https://colab.research.google.com/drive/1sO9plTqraPwdBF61sArlD6k6pZRpfJL8?usp=sharing 上記プログラムを実行すると、例えば以下のようなメタデータが得られます。 { "title": "Genji monogatari: Sakaki no maki|The Tale of Genji", "collection": " > Genji monogatari : Sakaki no maki", "dateIssued": "1650 (start)|1700 (end)", "place": "Kyoto", "identifier": "Hades Collection Guide ID (legacy): 443|Hades struc ID (legacy): 747877|Universal Unique Identifier (UUID): ce4bcd90-c60d-012f-9d19-58d385a7bc34" } まとめ APIを利用したデータ活用の参考になりましたら幸いです。 ...

2022年4月23日 · 更新: 2022年4月23日 · 1 分 · Nakamura

serverless-iiifで対応可能な画像サイズに関する実験

概要以下の記事で、AWSサーバーレスアプリケーションによるIIIF Image Serverの構築方法について説明しました。今回は、サイズが比較的大きい画像を登録し、タイル画像の配信が可能かを確認します。対象今回は、『鉱山借区図』（東京大学駒場図書館所蔵）を対象とします。 https://iiif.dl.itc.u-tokyo.ac.jp/repo/s/ichiko/document/4120a330-2f1c-4e2c-5d48-21aed4d42704 元画像は 300 MB弱のtif画像です。 pyramidal tiled tiffの作成以下のサイトを参考に、VIPSとImageMagickの両方を試してみました。 https://github.com/samvera-labs/serverless-iiif#creating-tiled-tiffs Using VIPS vips tiffsave source_image.tif output_image.tif --tile --pyramid --compression jpeg --tile-width 256 --tile-height 256 Using ImageMagick convert source_image.tif -define tiff:tile-geometry=256x256 -compress jpeg 'ptif:output_image.tif' 結果、VIPSの場合は 35.6 MB、ImageMagickの場合は 107.4 MB になりました。 IIIF画像URL それぞれのIIIF画像URLは以下です。 VIPS https://iiif3.a-ldas.com/iiif/2/kakezu_v/info.json ImageMagick https://iiif3.a-ldas.com/iiif/2/kakezu/info.json Image Viewerでの表示今回は、IIIF画像URLを読み込むことができるImage Annotator（神崎正英氏作成）を利用しました。 VIPS https://www.kanzaki.com/works/2016/pub/image-annotator?u=https%3A%2F%2Fiiif3.a-ldas.com%2Fiiif%2F2%2Fkakezu_v%2Finfo.json ImageMagick https://www.kanzaki.com/works/2016/pub/image-annotator?u=https%3A%2F%2Fiiif3.a-ldas.com%2Fiiif%2F2%2Fkakezu%2Finfo.json 結果上記いずれの場合においても、（一部読み込みに時間がかかるケースがありますが、）無事に表示することができました。本実験結果が参考になりましたら幸いです。

2022年4月14日 · 更新: 2022年4月14日 · 1 分 · Nakamura

LeafletのVue3での使用例（座標範囲の取得を含む）

LeafletのVue3での使用例（座標範囲の取得を含む）を紹介するリポジトリを作成しました。以下が動作例です。 https://static.ldas.jp/vue3-leaflet/ ソースコードは以下です。 https://github.com/ldasjp8/vue3-leaflet Vue3初学者のため、誤りなどがあるかもしれませんが、参考になりましたら幸いです。

2022年4月14日 · 更新: 2022年4月14日 · 1 分 · Nakamura

Vuetifyでダイアログを開いたときにダイアログ内にフォーカステキストフィールドを設定する

以下が参考になりました。 https://stackoverflow.com/questions/59407003/set-focus-text-field-inside-dialog-when-dialog-opened 以下のように、ダイアログを開いてから少し時間を置いてから、$refsにアクセスするとうまくいきました。 watch: { dialog: function(value) { if (value) { setTimeout(() => { this.$refs.name.focus(); }, 200); } } }

2022年4月7日 · 更新: 2022年4月7日 · 1 分 · Nakamura

Nuxt.jsでstaticディレクトリなどもホットリロードの対象にする方法

以下に説明がありました。 https://develop365.gitlab.io/nuxtjs-2.8.X-doc/ja/api/configuration-watch/ export default { ..., generate: { fallback: true, }, watch: ['static'], } 上記のように、nuxt.config.jsファイルでwatchを与えることで、対象ディレクトリも監視対象になりました。

2022年4月7日 · 更新: 2022年4月7日 · 1 分 · Nakamura

IIIF Presentation APIのバリデーション方法とその実例の紹介ほか

概要先日、以下の記事に書いた通り、IIIFのマニフェストファイルの配信と、IIIF Content Search APIを提供するアプリを開発しました。 https://zenn.dev/nakamura196/articles/76bdc86b1b7524 ただそれぞれ、APIに準拠しない記述をしていた部分がありました。本記事では、その修正内容を共有するとともに、バリデーションを行うPresentation API Validatorの使用方法について、実例とともに紹介します。 https://presentation-validator.iiif.io/ マニフェストファイルの修正上記のPresentation API Validatorのサイトにアクセスし、URL of Manifest to ValidateにマニフェストファイルのURLを入力し、対応したAPIのバージョン（今回は3.0）を選択します。その結果、以下のように、エラーがある場合には、その内容が表示されます。冒頭で紹介した私が開発したアプリが配信するマニフェストファイルは、そのサイズが大きいため、そのまま本バリデータにURLを入力すると、検証結果が表示されるまで時間がかかります。そのため、マニフェストファイルの1canvas目のデータのみを残したマニフェストファイルを別途作成しました。それをバリデータにかけた結果、59件のエラーメッセージが表示されました。以下、それぞれのエラー内容への対応方法を記述します。 Error 1 of 59. Message: ['https://ocr.aws.ldas.jp/v1/manifest/3437686.json'] is not of type 'string' before { "id": [ "https://ocr.aws.ldas.jp/v1/manifest/3437686.json" ] } 誤って、マニフェストファイルのidを配列の形で与えていました。以下のように修正しました。 after { "id": "https://ocr.aws.ldas.jp/v1/manifest/3437686.json" } Error 2 of 59. Message: 'Persistent ID' is not of type 'object' before { "metadata": [ { "label": "Persistent ID", "value": "info:ndljp/pid/3437686" } ] } この類のエラーは、2-23、26-59まで共通でした。（主に、metadataの記述箇所）以下のような形で、言語（ここではnone）を指定し、値は配列として与える必要がありました。必要に応じて、jaやenといった言語を与えることができます。 ...

2022年4月6日 · 更新: 2022年4月6日 · 2 分 · Nakamura

GCP: AI Platform Notebooksの作成時のエラー対応

以下を参考に、ノートブックインスタンスを作成しました。 https://cloud.google.com/blog/ja/topics/developers-practitioners/pytorch-google-cloud-how-train-pytorch-models-ai-platform gcloud notebooks instances create example-instance \ --vm-image-project=deeplearning-platform-release \ --vm-image-family=pytorch-1-7-cu110-notebooks \ --machine-type=n1-standard-4 \ --location=us-central1-a \ --boot-disk-size=100 \ --accelerator-core-count=1 \ --accelerator-type=NVIDIA_TESLA_T4 \ --install-gpu-driver \ --network=default この時、以下のエラーにより、ノートブックインスタンスを作成できませんでした。 ERROR: (gcloud.notebooks.instances.create) The zone 'projects/{project}/zones/us-central1-a' does not have enough resources available to fulfill the request. '(resource type:compute)'. そのため、locationをus-central1-aからus-central1-bに変更したところ、インスタンスを作成することができました。 gcloud notebooks instances create example-instance \ --vm-image-project=deeplearning-platform-release \ --vm-image-family=pytorch-1-7-cu110-notebooks \ --machine-type=n1-standard-4 \ --location=us-central1-b \ --boot-disk-size=100 \ --accelerator-core-count=1 \ --accelerator-type=NVIDIA_TESLA_T4 \ --install-gpu-driver \ --network=default 他の方の参考になりましたら幸いです。 ...

2022年4月5日 · 更新: 2022年4月5日 · 1 分 · Nakamura

GCP Vertex AIの特徴量（featurestore）の削除方法

概要 GCP（Google Cloud Platform）のVertex AIにおいて、特徴量（featurestore）の削除方法のメモです。後から気がつきましたが、以下に公式ドキュメントがありました。 https://cloud.google.com/vertex-ai/docs/featurestore/managing-featurestores#delete_a_featurestore 方法今回は、以下に示すように、testという特徴量（featurestore）の削除を試みます。以下のコマンドを実行することで削除できました。（GUIからの削除方法がわかりかねました。）値説明 LOCATION featurestore が配置されているリージョン（us-central1 など）。 PROJECT プロジェクト ID またはプロジェクト番号。 FEATURESTORE_ID featurestore の ID。 curl -X DELETE \ -H "Authorization: Bearer $(gcloud auth print-access-token)" \ https://{LOCATION}-aiplatform.googleapis.com/v1beta1/projects/{PROJECT}/locations/{LOCATION}/featurestores/{FEATURESTORE_ID} Cloud Shellで実行できました。まとめ同様のことでお困りの方の参考になりましたら幸いです。

2022年4月5日 · 更新: 2022年4月5日 · 1 分 · Nakamura

【使い方編】国立国会図書館「次世代デジタルライブラリー」で公開されているOCR結果をIIIFビューアで閲覧するアプリを作成しました。

概要使い方 Miradorでの表示例 Curation Viewerでの表示例まとめ概要国立国会図書館「次世代デジタルライブラリー」で公開されているOCR結果をIIIFビューアで閲覧するアプリを作成しました。以下のURLからお試しいただけます。 https://static.ldas.jp/ndl-ocr-iiif/ 使い方入力フォームに、「次世代デジタルライブラリー」で公開されている資料のIDを入力します。しばらくすると、「Mirador」とCODHが公開する「Curation Viewer」のボタンが表示されます。それぞれのビューアで、OCR結果をご確認いただけます。 Miradorでの表示例特に、「Mirador」については、「IIIF Content Search API」にも対応し、資料内検索が可能です。 https://iiif.io/api/search/1.0/ Curation Viewerでの表示例まとめ本記事では本アプリの使い方について説明しました。以下の記事では、本アプリの構築方法について説明しています。こちらも参考になりましたら幸いです。 nakamura196.hatenablog.com

2022年4月4日 · 1 分 · Nakamura

【AWS関連】AWS Lambda + Docker + pyvipsを用いたPyramid Tiled Tiffファイルの作成

概要 Amazon ECRリポジトリの作成 Lambda関数の作成 S3 バケットの作成イベント通知設定 Lambda関数の設定環境変数の設定アクセス権限基本設定試すまとめ概要 AWS LambdaとDockerとpyvipsを用いて、S3に格納された画像から、Pyramid Tiled Tiffファイルを作成するイメージを作成しました。 Amazon ECR Public Galleryは以下です。 https://gallery.ecr.aws/nakamura196/lambda-docker-vips-python ソースコードは以下です。 https://github.com/ldasjp8/lambda-docker-vips-python 以下、使用方法について説明します。 Amazon ECRリポジトリの作成まず、ECRリポジトリを作成します。次に、「プッシュコマンドの表示」から、コマンドを確認して、イメージをpushします。以下、コマンドの例です。 git clone https://github.com/ldasjp8/lambda-docker-vips-python.git cd lambda-docker-vips-python aws ecr get-login-password --region us-east-1 | docker login --username AWS --password-stdin XXXX.dkr.ecr.us-east-1.amazonaws.com docker build -t lambda-docker-vips-python . docker tag lambda-docker-vips-python:latest XXXX.dkr.ecr.us-east-1.amazonaws.com/lambda-docker-vips-python:latest docker push XXXX.dkr.ecr.us-east-1.amazonaws.com/lambda-docker-vips-python:latest 結果、以下のようにイメージがECRリポジトリに表示されます。そして、以下の「イメージのURI」をコピーしておきます。 Lambda関数の作成次にLambda関数を作成します。今回は、my-lambda-docker-vips-pythonという関数名にしました。「コンテナイメージURI」に、先ほどコピーしたURIを入力します。そして、「関数を作成」ボタンを押して、関数を作成します。 S3 バケットの作成今回、画像を登録するためのバケットと、上記の関数により変換した画像を格納するバケットの2つを用意します。今回は、my-lambda-docker-vips-python-inputとmy-lambda-docker-vips-python-outputの2つを作成しました。 ...

2022年3月31日 · 1 分 · Nakamura

pyvipsの使い方とPyramid Tiled Tiffファイルの作り方

概要 pyvipsを用いてPyramid Tiled Tiffファイルを作成するプログラムを作成しました。以下のGoogle Colabでお試しいただけます。 https://colab.research.google.com/drive/1VO1PgKgS3H21zXpg4g2inN-mtIrON5TQ?usp=sharing IIIFを用いた画像配信において、Pyramid Tiled Tiffファイルを作成する場面がありますが、PythonおよびVipsを用いた画像変換を行う際の参考になりましたら幸いです。なお、パラメータ等は以下を参考にしています。 https://github.com/samvera-labs/serverless-iiif#using-vips また、変換したPyramid Tiled Tiffファイルを配信する方法の一例として、以下の記事も参考になりましたら幸いです。ポイント vipsのインストール pyvipsを使用するのは、vipsを事前にインストールしておく必要があります。以下が参考になります。 https://www.libvips.org/install.html pyvipsを用いたPyramid Tiled Tiffファイルの作成以下のように使用します。 import pyvips ins = pyvips.Image.new_from_file(<入力画像ファイルのパス>) ins.tiffsave(<出力画像ファイルのパス>, tile=True, compression='jpeg', pyramid=True, tile_width=256, tile_height=256) 上記は、以下と同じ結果が得られる（はず）です。 vips tiffsave <入力画像ファイルのパス> <出力画像ファイルのパス> --tile --pyramid --compression jpeg --tile-width 256 --tile-height 256

2022年3月30日 · 更新: 2022年3月30日 · 1 分 · Nakamura

【備忘録】Maplatの使い方

古地図ビューアライブラリであるMaplatを使用してみましたので、使い方の備忘録です。 https://github.com/code4history/Maplat 上記のGitHubリポジトリのほか、以下のQiitaの記事なども参考になります。 https://qiita.com/tags/maplat?page=1 MaplatEditorのダウンロード以下のページから、MaplatEditorの最新版をダウンロードします。 https://github.com/code4history/MaplatEditor/wiki データの作成インストールしたMaplatEditorを立ち上げ、「新規作成」ボタンを押します。必要なメタデータを入力します。以下の図に示す項目が必須項目です。次に「対応点編集」タブに移動して、以下に示すように、対応点を追加します。「データセット入出力」タブに移動して、「地図データエクスポート」ボタンを押します。以下のように、<id名>.zipというファイルを適当な場所に保存します。ダウンロードされたファイルを展開すると、以下に示すように、tmbs、tiles、mapsフォルダが格納されていることが確認できます。アプリを作成する（ソースコードを利用する）本記事では、ソースコードから利用する方法を説明します。npmコマンドが使用できる前提で話を進めます。サンプルパッケージなどを利用して、より簡単にアプリを作成する方法が以下にまとめられています。こちらも参考にしてください。 https://github.com/code4history/Maplat/wiki/How-to-set-up-Maplat-Application 準備適当なフォルダに移動して、以下に示すようなコマンドにより、ソースコードをダウンロードします。Maplatというフォルダが作成されます。 git clone https://github.com/code4history/Maplat.git 次に、以下のコマンドにより、ライブラリのインストールを行います。 cd Maplat npm install 次に、以下のコマンドにより、アプリケーションを立ち上げます。 npm run server 以下のURLでアプリケーションにアクセスすることができます。 http://localhost:8888/index.html アプリケーションの編集まず、tmbs、tiles、mapsフォルダに、先にエクスポートした中身をそれぞれコピーします。以下、mapsフォルダに追加した例を示します。そして、<Maplatのダウンロードパス>/apps/sample.jsonを編集します。具体的には、以下に示すように、sources項目に、作成した地図のid（ここでは0001）を追加します。その結果、以下のように、追加した画像がアプリケーションに表示されます。上記の入力値において、labelの値を変更することにより、アプリ上での表示名を変更することができます。また、<Maplatのダウンロードパス>/public/index.htmlを編集することにより、表示内容を変更することができます。一例として、以下に示すように、enableBorder: trueをoptionに追加してみます。その結果、以下の図に示すように、画面右下に「地図境界表示」アイコンが表示され、選択すると、地図の境界が表示されます。他にもさまざまな設定が可能です。設定内容については、以下が参考になります。 https://github.com/code4history/Maplat/wiki/How-to-set-up-Maplat-Application#4-appssamplejson%E3%81%AE%E8%A8%AD%E5%AE%9A%E6%96%B9%E6%B3%95 以上でアプリケーションの編集は終了です。今回は、新しく地図画像を追加しただけでした。実際には、上記のリポジトリではじめから同梱されている地図画像情報の削除等を行い、公開に必要なものだけに整理する必要があります。参考以下は参考情報ですが、<Maplatのダウンロードパス>/src/index.jsの以下の行をコメントアウトなどすると、コンソール画面に表示される内容を軽減できます。 https://github.com/code4history/Maplat/blob/19618d23a3d80cbde7db753cd769a41575527dd4/src/index.js#L1590 ビルドアプリケーションの編集が完了したら、ビルドを行います。以下のコマンドを実行します。 npm run build その結果、distとdist_packedフォルダが更新されます。デプロイビルドした結果などをデプロイします。ここでは、AWSのS3にアップロードする方法を示します。 ...

2022年3月25日 · 更新: 2022年3月25日 · 1 分 · Nakamura

カレンダー検索アプリを作成しました。

概要カレンダー形式で情報を表示するウェブアプリケーションを作成しました。以下、はてなブログの記事の一覧を対象にした表示例です。 https://static.ldas.jp/calendar/?u=https://nakamura196.github.io/json/calendar.json https://github.com/ldasjp8/calendar 以下にアクセスして、「例」ボタン、「追加」ボタンをクリックすることで、表示例をご確認いただけます。 https://static.ldas.jp/calendar/ 以下のような形式のjsonファイルのURLを引数に指定します。 https://nakamura196.github.io/json/calendar.json 以下、jsonファイルの作成方法の一例として、Excelファイルからの作成方法について説明します。 jsonファイルの作成方法 Excelファイルの作成以下に示すようなExcelファイルを作成します。「metadata」と「items」の2つのシートを用意します。 https://docs.google.com/spreadsheets/d/14myDqZTxocwOT0Mw3ZzKLO81E6r15R-49oUh2dG9Rbo/edit?usp=sharing シート「metadata」本シートには、A列に示す「description」「header」「footer」「link」を用意します。以下の画面に対応します。「link」については、B列「literal」が表示文字列、C列「uri」がURLです。複数行を入力可能です。シート「items」本シートの以下の列が、予約済みの項目です。collectionsとdateは検索フォームに使用されます。 collections date label thumbnail url description G列以降の「Updated」などは、任意の項目です。上記の項目は、以下のように対応します。なお、セル内に複数の値を入力したい場合には、「|（パイプ）」で区切ってください。 jsonファイルへの変換以下のGoogle Colabを利用して、用意したExcelファイルをアップロードして、jsonファイルに変換します。 https://colab.research.google.com/drive/1aJKbJjK9Gu4SwDp6IfGCHNuhTH3pJ3hp 上記プログラムの実行後、ダウンロードされたJSONファイルをGitHub PagesやGist、レンタルサーバ等にアップロードし、そのURLを以下のカレンダー表示アプリに入力してください。 https://static.ldas.jp/calendar/ （参考）はてなブログの記事を対象とした利用例はてなブログの記事を対象とした利用例として、はてなブログのAtomPub APIを用いて、上述したExcelファイルを生成するプログラムを作成しました。以下の記事を参考にしてください。

2022年3月24日 · 更新: 2022年3月24日 · 1 分 · Nakamura

【AWS関連】AWS Lambdaを用いた物体検出API（Flask + yolov5）の構築

概要 AWS Lambdaを用いた物体検出API（Flask + yolov5）の構築を行います。機械学習の推論モデルをAWS Lambdaを用いて構築することにより、コストの軽減を目指します。以下の記事を参考にさせていただいています。 https://zenn.dev/gokauz/articles/72e543796a6423 リポジトリの内容の更新や、API Gatewayからの利用方法の追記などを行なっています。 Lambdaへの関数登録以下のGitHubリポジトリをクローンします。 git clone https://github.com/ldasjp8/yolov5-lambda.git ローカルで実行する次に、venvを用いて仮想環境を作成して、モジュールをインストールします。 cd yolov5-lambda python -m venv venv source venv/bin/activate cd yolov5 pip install --upgrade pip pip install -r requirements.txt その後、以下を実行すると、物体検出結果のjsonデータが出力されます。 python app.py デプロイ冒頭で述べた通り、以下の記事の成果を利用させていただいています。 https://zenn.dev/gokauz/articles/72e543796a6423 ここでは、Jupyter Notebookを利用します。 cd ../ jupyter notebook Jupyter Notebookが起動した後、以下のbuild_and_test.ipynbを選択して、手順の通りに実行します。今回作成したリポジトリで変更した点として、まずconf.jsonファイルをロードするようにしています。 cloneしたリポジトリにconf.json.templateを格納していますので、conf.jsonに名前を変えて、profile項目に、AWS CLIにプロファイル名を与えてください。 mv conf.json.template conf.json code conf.json Notebookの実行にあたっては、dockerを起動しておく必要があります。（オプション）AWS Lambdaでのテスト実行以下、AWS Lambdaでのテストの実行方法を示します。なお、上記のNotebook内で推論まで実行するため、本作業は必須ではありません。（私の備忘録です。） Lambdaの関数ページにアクセスし、「テスト」タブを選択します。そして、以下に示すように、テンプレートで「agigateway-aws-proxy」を選択し、サンプルとして利用する画像のbase64エンコードされた文字列を、body項目に与えます。画像のbase64エンコードされた文字列の作成については、上記のNotebookの「推論してみる」の項目にありますので、参考にしてください。以下のように実行結果を確認することができます。 API Gatewayの設定 API Gatewayの「APIを作成」から、REST APIの「構築」をクリックし、 ...

2022年3月24日 · 1 分 · Nakamura

AWS Lambdaを用いた物体検出API（Flask + yolov5）の構築

2022年3月24日 · 更新: 2022年3月24日 · 1 分 · Nakamura