窓を作っては壊していた人のブログ

この謎のブログタイトルの由来を知るものはもういないだろう

OCR Read API v3.1のPreviewで日本語の認識を試してみたメモ

mspjp.connpass.com

で発表してきた内容です。

9月のアップデートでCognitive Services Computer Vision OCRが日本語対応しました(Preview扱いではありますが)。

追記2020/10/27

GAしたようです

Computer Vision の新機能 - Azure Cognitive Services | Microsoft Docs

追記終わり

今までOCR APIでも日本語の認識が出来ていたのですが、精度はやや低い印象がありました。 そこで今回はアップデートのあったOCRのRead APIを使って、最近ハマっているリングフィットアドベンチャーのリザルト画像を解析して、運動時間やカロリー、運動内容をログに残す準備をしてみました。

docs.google.com

導入編

発表時は簡易的なデモを行ったためこの辺りの資料が残ってません…… 敷いて言えばスライドの13~15ページあたりの話でしょうか。

実装編

スライド中ではAPIコンソールを使用する方法を紹介しました(こちらもデモで行ったので資料が…動画が公開されたら紹介いたします)。

本記事ではサンプルコードを使う方法をご紹介………しようと思ったらFacebookでめちゃくちゃ良い導入の記事がシェアされてきたのでこちらの紹介で済ませようかと思います。

blog.beachside.dev

この記事で書くことなくなった!

ということで、余ったスペースには今回作成した可視化のツールの説明でも入れておきましょう。

認識結果を可視化してみる

cognitive-cv-visualizer.yamachu.dev

こんなのを作ってみました。

こちらはAzure Static Web Appsホスティングを行っています。 コードは

GitHub - yamachu/cognitive-cv-visualizer: Azure Cognitive Services Computer Visoin API Read and OCR Response visualizer

で公開しています。

フロントエンドでやってることと言えばRead APIで得られた結果のJsonをパースしてるだけです。

光学式文字認識 (OCR) - Computer Vision - Azure Cognitive Services | Microsoft Docs

ここのDocumentのStructured JSONにboundingBoxの順番が書いてあるのでそれ通りに実装してみました。 出力例にある認識結果をいい感じに出力するやつどこにあるんだろう………これがアレば作らなくも済んだのにとか思いつつ…w

バックエンドは最近 C# 対応が行われたのと、Read APIのサンプルコードをそのまま使えるという点でC# で実装を行っています。

こんな感じでCognitive Servicesのサンプルコードでバックエンドを実装し、後はガワを作り、Azure Static Web Appsでホスティングするだけでおもちゃを公開できるのは本当に最高ですね! Cognitive Servicesには他にも面白いAPIがたくさんあるので、ぜひ探してみてください!

前試してみた例

Azure Cognitive ServicesのSpeech to Textで書き起こしをしてみよう - Qiita