本記事では、「DioDocs for PDF（ディオドック）」の最新バージョン「V8J SP1」で追加された、PDFビューワで表示したPDFドキュメントに含まれる表データを抽出する機能について紹介します。
PDFビューワについて
DioDocs for PDFのPDFビューワはWebアプリケーション開発で利用できるJavaScriptライブラリとして提供されています。PDFビューワには大きく分けて2つの機能があります。
- PDFファイルの表示
- PDFファイルの読み込み・ダウンロード・印刷
- ページナビゲーション（先頭、前、次、最後、ページ指定）
- テキストの選択、検索
- 拡大・縮小・全画面表示
- ビューモード（シングル・連続ページ、回転、幅にフィット）
- サムネイル、アウトライン（ブックマーク）の表示
- 注釈、フォームフィールドの表示
- PDFファイルの編集
- テキストやスタンプなどさまざまな注釈を追加・編集
- テキスト、コンボボックス、ラジオボタンやチェックボックスなどさまざまなフォームフィールドを追加・編集
「PDFファイルの編集」機能を使用するには、サーバーサイドもしくはWebAssemblyによる「サポートAPI」を実装する必要があります。今回紹介する「表データの抽出」機能については、現時点でWebAssemblyのサポートAPIでは対応していませんので、サーバーサイドでサポートAPIを実装して使用することが可能になります。
なお、WebAssemblyによるサポートAPIはV7J SP2で追加された機能となります。詳細については以下の記事をご覧ください。
使用するサンプル
今回はASP.NET CoreアプリケーションにPDFビューワとサポートAPIを追加している以下のサンプルを使用します。
使用するPDFファイルは、このサンプルに含まれるCreateTable.pdfを使用します。こちらには以下のような表データが含まれています。
表データの抽出
V8J SP1では、PDFビューワで表示しているPDFドキュメントから表データを抽出するためのボタン「表データ抽出」がツールバーに表示されます。
この「表データ抽出」ボタンをクリックすると、PDFビューワの左側にサイドパネル「表データ抽出」が開きます。
サイドパネルが開いた状態でマウスをPDFビューワで表示しているPDFファイル上に移動するとマウスカーソルが「＋」に切り替わります。マウス操作により抽出する表データの領域を設定できます。
この状態だと「生年月日」と「血液型」の列が分割して認識できていません。そこで表のヘッダ「生年月日」と「血液型」の間にある「→」をクリックします。このボタンをクリックすると右側の列と結合されます。
次に表データの抽出領域にある縦線をマウス操作で実際の列の幅に合わせます。
この状態だと「体重」の列が認識できていません。そこで表のヘッダ「体重」の近くにある「＋」をクリックします。このボタンをクリックすると、抽出領域に列が追加されます。
これで表データの抽出領域の設定は完了です。抽出する表データは、サイドパネルで確認できます。こちらに表示される認識結果は、抽出領域で列の追加や削除などのマウス操作するとリアルタイムに反映されます。
抽出した表データをファイルに出力、コピー
抽出した表データは、サイドパネルからファイルに出力したり、コピーすることが可能です。
ファイルに出力
デフォルト設定ではCSVが選択されていますが、その他にもTSV／JSON／XLSX／XML／HTMLなどのファイル形式を選択することができます。
形式を指定してコピー
コピーにはXLSX以外のファイル形式が対応しています。抽出した表データをクリップボードにコピーして、別のアプリケーションにペーストすることが可能です。
DioDocsの最新バージョン「V8J SP1」の新機能については、以下のページで紹介していますのでこちらも是非ご覧ください。
さいごに
弊社Webサイトでは、製品の機能を気軽に試せるデモアプリケーションやトライアル版も公開していますので、こちらもご確認いただければと思います。
また、ご導入前の製品に関するご相談やご導入後の各種サービスに関するご質問など、お気軽にお問合せください。