Have an amazing solution built in RAD Studio? Let us know. Looking for discounts? Visit our Special Offers page!
DelphiRAD Studio

Google Cloud Vision APIを利用して画像のロゴ検出を行うDelphiアプリケーションを作成する

google-cloud-vision-label-detection-api-hero-image

この記事は、Victory Fernandes氏のブログの抄訳です

開発者は「コーヒーを飲みながら長時間仕事をする趣味があることで知られている」という決まり文句があるようです。 これは開発者の中にはコーヒー好きが多いという文言ですが、別に開発者じゃなくてもおそらく、下の画像のロゴマークは誰でもご存じではないかと思います。そうです、これは米国の多国籍企業であり、世界最大のコーヒーチェーンである「スターバックス」のロゴです。

ロゴが持つ力

ポイントは、コーヒーカップには名前が書かれておらず、ロゴがあるだけだということです。そのロゴがどのブランドのものかわからないとしたら、そのロゴが何を表しているのか、誰のものなのかを知る方法があったらいいと思いませんか? さらに言えば、そのロゴを認識する能力を、独自のWindows、デスクトップ、モバイルアプリケーションに取り入れることができたら、もっといいと思いませんか?Google Cloud Vision APIを使えば、まさにそれが可能になります。

Google Cloud Vision ロゴ検出API

「ロゴ検出」のオプションは、Google Cloud Vision APIの一部であり、画像内の複数のロゴを検出して情報を抽出するために使用できます。検出されたロゴに、Googleは識別されたエンティティのテキスト説明、機械学習AIによる検出の正確さを示す信頼度スコア、ファイル内のロゴの境界ポリゴンが提供されるので、画像のエリア内でのロゴの位置がわかります。

starbucks1-2325393-2

Delphiアプリケーションで機械学習AIを使用できますか?

Google Cloud Vision APIは、事前に学習された強力な機械学習モデルを提供しており、RESTまたはRPC APIメソッド呼び出しを介して、デスクトップおよびモバイルアプリケーションで簡単に使用することができます。例えば、アプリケーションでオブジェクト、場所、アクティビティ、動物種、製品を検出したい場合や、顔だけでなく感情も検出したい場合、または印刷されたテキストや手書きのテキストを読み取る必要がある場合などです。これらの機能は、無料(機能ごとに最初の1,000ユニット/月まで)または非常に手頃な価格で実行でき、先行投資なしでお客様の使用状況に合わせて拡張することができます。

RAD Studioで提供しているRESTクライアントライブラリを使用して、Google CloudのVision APIへ簡単にアクセスでき、デスクトップおよびモバイルアプリケーションを強化することができます。リクエストが成功した場合、サーバーは200 OK HTTPステータスコードとJSON形式のレスポンスを返します。

RAD StudioやDelphiのアプリケーションでは、APIを呼び出してローカルの画像ファイルの検出を行い、リクエストの本文に画像ファイルのコンテンツをbase64エンコードした文字列として送信する方法と、Google Cloud StorageやWeb上の画像ファイルを使用する方法(この場合は、リクエスト本文に画像ファイルを含めての送信は不要)があります。

Google Cloud Vision ロゴ検出APIを設定するにはどうすればよいですか?

[ロゴの検出]セクション(https://cloud.google.com/vision/docs/detecting-logos)のGoogle Cloud Vision APIドキュメントを必ず参照してください。一般的に以下の手順はGoogleのWebサイトで行う必要があります。

  • https://cloud.google.com/visionにアクセスし、Gmailアカウントでログインする
  • Google Cloud Platform(GCP)のプロジェクトを作成または選択します
  • そのプロジェクトのVision APIを有効にする
  • そのプロジェクトの請求を有効にする
  • API Key credentialを作成する

Google Vision ロゴ検出 APIのエンドポイントを呼び出すにはどうすればよいですか?

ここで必要なのは、HTTP POSTメソッドでAPIのURLを呼び出し、リクエストのJSON bodyにLOGO_DETECTIONタイプを、ソースに解析したい画像へのリンクを渡すことです。

APIのアクセスには、Java、Node.js、Python、C#、PHPなどプログラミング言語が利用できますが、Delphi言語には対応していないため、代わりにRESTクライアントライブラリを使用することができます。RESTクライアントライブラリの詳細はクイックスタートガイド(https://cloud.google.com/vision/docs/quickstart-client-libraries)に掲載されています。

実際には、Google Cloud Visionドキュメントガイドの下部のページ(https://cloud.google.com/vision/docs/detecting-logos)に「Try This API」というオプションがあり、以下のようなJSONリクエストボディを投稿し、JSONレスポンスを得ることができます。

POST https://vision.googleapis.com/v1/images:annotate
{
"requests": [
{
"features": [
{
"type": "LOGO_DETECTION"
}],
"image": {
"source": {
"imageUri": "https://images.pexels.com/photos/791942/pexels-photo-791942.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940"
}}}]}

Google Vision ロゴ検出 APIのエンドポイントは、どんなデータを返すのですか?

APIの呼び出し後の結果は、「ロゴ」の説明、0(信頼なし)から1(非常に高い信頼)までの範囲(小数点)の信頼度のスコア値、および画像内のオブジェクトが見つかった場所を示す境界ポリゴンを含むリストです。ポリゴンの情報を使用して、画像の上に正方形を描画し、ロゴを強調表示し、最終的には下の画像のような結果になります。
starbucks2-9180061-2
{
   "responses": [
     {
       "logoAnnotations": [
         {
           "mid": "/m/018c_r",
           "description": "Starbucks",
           "score": 0.9508903,
           "boundingPoly": {
             "vertices": [
               {
                 "x": 474,
                 "y": 931
               },
               {
                 "x": 697,
                 "y": 931
               },
               {
                 "x": 697,
                 "y": 1210
               },
               {
                 "x": 474,
                 "y": 1210
               }
             ]
           }
         }
       ]
     }
   ]
 }

アプリケーションからGoogle Cloud Vision ロゴ検出 APIへアクセスするにはどうすればよいですか?

Google側でロゴ検出APIを設定する基本的な手順が完了したら、コンソールに移動し、Credentialsメニュー項目でCreate Credentials butonをクリックし、APIキーを追加します。このキーは後で必要になるので、コピーしておきましょう。

captura-de-tela-2021-04-17-20-22-54-4

RAD Studio (Delphi)では、RESTデバッガを使ってRESTコンポーネントを自動的に作成し、アプリに貼り付けることができるので、APIへの接続が非常に簡単です。

RAD Studio (Delphi/C++Builder)では、すべての作業は3つのコンポーネントを使用して行われ、API呼び出しが行われます。 それらは、TRESTClientTRESTRequest、およびTRESTResponseです。 RESTデバッガを利用して正常に接続できたら、コンポーネントをコピーして貼り付けると、TRESTClientBaseURLにAPIのURLが設定されます。 TRESTRequestコンポーネントで、リクエストタイプがrmPOSTContentTypectAPPLICATION_JSONがそれぞれ設定され、そしてPOSTのリクエスト本文が1つ設定されます。

DelphiアプリケーションでREST接続の設定するには、どうすればいいですか?

RAD Studio (Delphi)を起動し、IDEのメイン メニューから [ツール] > [RESTデバッガ] をクリックします。REST デバッガを以下のように設定します。 content-typeapplication/jsonに設定して、POST URL、JSON リクエスト本文、作成した API キーを追加します。 最後に「(Send Request)要求の送信」ボタンをクリックすると、先ほど示したようなJSONレスポンスが表示されます。
captura-de-tela-2021-04-17-20-24-22-3
captura-de-tela-2021-04-17-20-25-20-3

Google Cloud Vision ロゴ検出 APIを使用してWindowsデスクトップまたはAndroid / iOSモバイルデバイスアプリケーションを構築するにはどうすればよいですか?

RESTデバッガでAPI呼び出しを正常に設定およびテストが完了したので、「(Copy Components)コンポーネントのコピー」ボタンをクリックし、Delphi IDEに戻って新しいアプリケーションプロジェクトを作成し、メインフォームにコンポーネントを貼り付けます。

TButtonのOnClickのイベントハンドラに以下のようなGoogleVision APIを呼び出して、JSONレスポンスを受信するコードを追加します。このコード例では、TRESTResponseコンポーネントのRootElementは’response[0].logoAnnotations‘に設定されています。これは、JSON内の ‘logoAnnotations‘ 要素が、インメモリーテーブル(具体的にはTFDMemTable)のデータとして保持されます。
procedure TForm1.Button1Click(Sender: TObject);
var
APIkey: String;
begin
FDMemTable1.Active := False;
RESTClient1.ResetToDefaults;
RESTClient1.Accept := 'application/json, text/plain; q=0.9, text/html;q=0.8,';
RESTClient1.AcceptCharset := 'UTF-8, *;q=0.8';
RESTClient1.BaseURL := 'https://vision.googleapis.com';
RESTClient1.HandleRedirects := True;
RESTClient1.RaiseExceptionOn500 := False;
 
//APIkey := 'put here your Google API key';
RESTRequest1.Resource := Format('v1/images:annotate?key=%s', [APIkey]);
 
RESTRequest1.Client := RESTClient1;
RESTRequest1.Response := RESTResponse1;
RESTRequest1.SynchronizedEvents := False;
 
RESTResponse1.ContentType := 'application/json';
 
RESTRequest1.Params[0].Value := Format(
'{"requests": [{"features": [{"maxResults": %s,"type": "LOGO_DETECTION"}],"image": {'+
'"source": {"imageUri": "%s"}}}]}', [Edit2.text, Edit1.text]);
 
RESTResponse1.RootElement := 'responses[0].logoAnnotations';
 
RESTRequest1.Execute;
 
memo2.Lines := RESTResponse1.Headers;
memo3.Lines.text := RESTResponse1.Content;
end;

RESTを使用してGoogle Cloud Vision APIを呼び出すDelphiアプリケーションのサンプルプログラム

このサンプルプログラムでは、分析する画像へのリンクを貼り付けるためのTEditと、maxResultsパラメータを設定するための別のTEdit、REST API呼び出しのJSON結果を表示するTMemo、表形式でデータをナビゲートおよび表示するためのTStringGridコンポーネント、そしてJSONレスポンス結果を保持するTFDMemTableコンポーネントをフォーム上に配置しています。 ボタンをクリックすると、画像が分析され、アプリケーションはJSONレスポンスをテキストおよびグリッド内のデータとして表示します。これで、レスポンスデータを統合して、アプリケーションがニーズに合った方法で情報を処理するために必要なすべてのものが揃いました。
captura-de-tela-2021-05-20-10-59-46-8599607-2

まとめ

このブログでは、以下の内容を紹介いたしました。

  • 画像でロゴ検出を実行するためにGoogle Cloud Vision APIへサインアップ
  • RAD StudioのRESTデバッガを使ってエンドポイントに接続し、RESTコンポーネントを実際のアプリケーションにコピー
  • アプリケーションからGoogle Cloud Vision APIに接続し、Logo Detectionの画像解析のJSONレスポンスを取得し、その結果をメモリデータセットに保持し、データの表示

RAD Studio(Delphi)を利用すると、様々なオープンな技術をREST APIと連携し、Windows、Linux、macOS、Android、iOS等のマルチプラットホームに対応したRESTクライアントアプリケーションが簡単に作成することができます。

今回紹介いたしましたデスクトップとモバイル向けのGoogle Cloud Vision APIを利用したロゴ検出のデモプログラムは、以下のURLからダウンロードできます。

https://github.com/checkdigits/google_logo_detection_api_delphi_example

関連情報

Kai for RAD Studio is Now Available! Special Live Webinar: Introducing Kai - A New Chapter for RAD Studio RAD Studio 13.1 Florence Now Available

Reduce development time and get to market faster with RAD Studio, Delphi, or C++Builder.
Design. Code. Compile. Deploy.

Start Free Trial   Upgrade Today

   Free Delphi Community Edition   Free C++Builder Community Edition

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.

IN THE ARTICLES