Microsoft Flow経由でWioNodeに接続したリレーを制御してLED表示灯を点灯してみる【前編】

Microsoft Flow経由でWioNodeに接続したリレーを制御してLED表示灯を点灯してみる

年度が替わって、ほげほげと仕事をしていたところ

「某社、FAXの運用やめるってよ」

という話がきました。自分の担当は24h/365dな環境で連絡があってもメールなどに目を向けてほしくない(監視作業)ので、可能であれば そういう確認の作業には時間を割きたくないのでFAXのほうが作業が楽です。(どうせ内職することがわかっていて且つ質が落ちる)でも、個人の意見としては伝送手段にFAX使わなくてもよいので撤廃も時代なんだろうなという点では納得はしています。

業務としては、連絡があったときにブザーが鳴って紙面に印刷してくれればこだわりはありませんし、最悪、情報の確認の忘れさえ防げれば問題はありません。 つまりブザーや音声、パトランプだけでもいい割り切りができます。(音声も監視しているので、できればブザーや音声は鳴らしたくないけど電話はあるのでそこは目を瞑ります)

んじゃ作ってみるか

要素としては単純なので、まあできるかなーとは思っていたのですが仕事なので以下の点が引っかかります。

  • 手持ちの機材でなんとかできるといいなあ
  • コードは書きたくないなあ(嘘くさいけど)
  • メンテナンス(ハード・ソフトともに)はあんまりしたくないなあ
  • 少しはセキュリティ関連にも配慮がしたいなあ

うちの会社にはなんちゃって技術者っぽい人しかいない(弊社には一般にいう開発者はいません、キリッ!)ので 引き継ぎのことも考えると、コードを書くなんていう愚行行為は薦めることができません。 ちなみに、自社でプログラミングするという雰囲気をみせると絶命する拒絶反応を見せる人が多いです。

こういう前提がある中で採用するものの候補を考えてみました。

要素としては

  1. 定期的なメールの受信確認
  2. 受信時にリレーの制御

これだけが抑えられればいいので、ハードとしてはWioNodeGroveでリレーを付ければよさそうです。

WioNodeはWebへのPOSTメソッドでのアクセスができればいいので

  1. 定期的なメールの受信確認
  2. 受信時にWebアクセス(→リレー制御)

こんな感じになります。

さて、次にメールの受信検知に関してなのですが、Office365なメールを使用しているので、そちらを使用し、IFTTTMicrosoft Flowを選択肢として考えました。 (実質にたようなサービスはありますので類似したサービスでもいい感じがします。)Microsoft Flowでは認証がOffice365上でできることもあるので、今回はこちらを採用することにしました。

  1. 定期的なメールの受信確認(Microsoft FlowのOffice365メールの受信をトリガとする)
  2. メール受信時にWebアクセス(→リレー制御)(Microsoft FlowのWebアクセスをアクションとする)

ほぼこれで処理が出来上がったような気がします。

WioNodeの設定

ハードウエアはこちらを準備しました。(家に転がっていたので)

【WioNode】

【GROVE - リレー】

まずは使用するWioNodeの設定を行います。

設定に関しては基本的に過去のエントリーを参照してもらえればいいかなと思います。

uepon.hatenadiary.com

今回は、以前設定を行ったWioNodeWiFiのアクセスポイントの変更処理を行う必要があったので、その部分を記載しておきます。 (デバイスを削除して新規に行っても問題はありません)

ネットワークの再設定

スマートフォンのアプリを使用してデバイスの設定のハンバーガーボタンを押し、その中から【Change WiFi Network】を選びます。

f:id:ueponx:20180501172635p:plain

ここで確認のダイアログが表示されるので、変更を行う場合には【Confirm】を選択します。

f:id:ueponx:20180501172645p:plain

【Confirm】を押すとネットワークの変更手順を最初から行うことになります。ただし、この画面からでも設定中断するとネットワークの設定は変更されないようです。

f:id:ueponx:20180501172654p:plain

リレーの設定

WiFiの設定が変更できたら、今度は接続デバイスの設定を変更します。メニューのOutputから【Relay】を探し出し、

f:id:ueponx:20180501172729p:plain

Groveの端子にドラッグ&ドロップします。

f:id:ueponx:20180501172743p:plain

設定の変更が行われると画面の下に【Update Firmware】というボタンが表示されるのでクリックすると、

f:id:ueponx:20180501172751p:plain

接続されたセンサーなどのファームウェアWioNodeにダウンロードされて

f:id:ueponx:20180501172759p:plain

センサーが使用可能な状態になります。 続いては設定後のテストを行ってみます。

APIの確認

設定と同様に右上のハンバーガーボタンをクリックし、その中から【View API】を選びます。

f:id:ueponx:20180501172635p:plain

するとAPIの説明とテストページが表示されるのでこれを使ってテストを行います。

f:id:ueponx:20180501172806p:plain

リレーのモジュールには状態の確認用のAPIと状態(ON/OFF)の変更のAPIの2つがあります。

f:id:ueponx:20180501172814p:plain

ページ内からもAPIへのアクセスができるのでこれで動作を確認することができます。

Microsoft Flowの設定

以下のURLにアクセスをします。認証が必要であることもあるのでその際はログインをしてください。

japan.flow.microsoft.com

画面上部に【マイフロー】をクリックします。

f:id:ueponx:20180501133512p:plain

すると自分の作成したフロー処理の一覧が表示されます。

f:id:ueponx:20180501133734p:plain

この画面上でウインドウの上の方にある【一から作成】をクリックして新しいフロー処理を作成します。

f:id:ueponx:20180501134409p:plain

すると画面が以下のように変わるので更に【一から作成】ボタンをクリックします。

f:id:ueponx:20180501134644p:plain

これでフロー処理を作成する準備ができました。ウインドウ内にコネクタとトリガーの候補が並んでいます。

f:id:ueponx:20180501134754p:plain

表示されていない場合には検索バーにサービス名を入力することになりますが、今回はOffice365 Outlookがトリガーになりますのでこれを選択します。

f:id:ueponx:20180501135218p:plain

ユーザによっては候補一覧の並びが異なっていると思いますので、その場合には検索バーにOutlookと入力することで選択肢を絞ることができます。今回はOffice365 Outlookを選択します。(以下のアイコンのものになります。)

f:id:ueponx:20180501135343p:plain

アイコンをクリックすると、サービスに含まれるトリガーが一覧として表示されます。 今回は【Office365 Outlook メールが届いたとき】のトリガーをこの中から選択します。

f:id:ueponx:20180501135709p:plain

すると以下のような表示にかわります。デフォルトではInboxフォルダにメールが受信メールが保存されたことがトリガーになっています。

f:id:ueponx:20180501135843p:plain

【新しいメールが届いたとき】ボックスの中の【詳細オプションを表示する】をクリックすると設定を詳細にすることができます。

f:id:ueponx:20180501140148p:plain

詳細項目は以下のようになっています。

  • フォルダー
  • 宛先
  • 開始
  • 重要度
  • 添付ファイルあり
  • 添付ファイルを含める
  • 名フィルター

今回はメーリングリストから送信されたメールのfromアドレスと件名を確認することでトリガーとして設定を行いますので以下のオレンジ色の部分に関係する情報を入力します。(宛先は不要かも)

f:id:ueponx:20180501140711p:plain

テストだけをおこなうのであれば、【宛先】【開始】は自分のメールアドレスでもいいかなと思います。今回はテストなので、グレーアウトしている部分は自分のアドレスにしてみました。件名はML_Titleが含まれるものとしています。

f:id:ueponx:20180501141054p:plain

これでメールの受信した際のトリガーが作成できました。そのトリガーに対応するアクションを記述していきます。トリガー設定の下にある【新しいステップ】ボタンをクリックします。

f:id:ueponx:20180501141300p:plain

すると、【アクションの追加】、【条件の追加】、【さらに追加】と選択肢が出るので今回はこの中から【アクションの追加】をクリックします。

f:id:ueponx:20180501141448p:plain

クリックすると今度はアクションの選択画面になります。メール受信後にWebアクセスを行うことになるので検索BOXにHTTPと入力し、絞り込みを行います。

f:id:ueponx:20180501141638p:plain

絞り込みを行うと次のような画面になります。コネクタのHTTPをクリックし

f:id:ueponx:20180501141841p:plain

f:id:ueponx:20180501141928p:plain

さらにアクション一覧の中からHTTPをクリックします。

f:id:ueponx:20180501141950p:plain

一覧から下のものを選びます。

f:id:ueponx:20180501142117p:plain

するとWebアクセスの設定画面になります。

f:id:ueponx:20180501142142p:plain

設定項目は

  • 方法
  • URI
  • ヘッダー(KeyとValueのペア)
  • 本文

となります。WioNodeのリレーのアクセス設定は以下のようになっているので

f:id:ueponx:20180501172814p:plain

  • 方法:POST
  • URIhttps://us.wio.seeed.io/v1/node/GroveRelayD1/onoff/1?access_token=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX(XXXXXXXXXXX…の部分は固有のキーになりますので各自のものに修正をお願いします。)

f:id:ueponx:20180501142618p:plain

こんな感じでOKです。

あとはこのフロー処理に名前を付けて保存をします。画面上部の無題のところを今回はMail_WioNode_Relayとしてみました。日本語名でも問題はありません。名前を変更したら上部にある【保存】ボタンをクリックします。

f:id:ueponx:20180501143653p:plain

保存したら名前の部分の左側にある【←】をクリックします。こんな風に表示されていればOKです。Office365との接続ができていないと画面の右側が少し違うかもしれません。事前に接続用の認証を行えば問題ないかと思います。また、画面右上の【このフローはオン】になっていればテストもできるようになっています。

作成中に認証ができていない場合はこんな風に表示されます。

f:id:ueponx:20180502002841p:plain

フロー作成後に認証が完了していない場合はこんな風に表示されます。

f:id:ueponx:20180502002918p:plain

f:id:ueponx:20180501144156p:plain

では、テストを行ってみます。

テストしてみる!

あとはメールを送信して、RelayがONになるかをテストしてみます。今回はfromもtoも自分でsubjectにML_Titleが含まれるようなメールを送信しています。

f:id:ueponx:20180501145331p:plain

送信し、受信が行われると

f:id:ueponx:20180501145720j:plain

リレー基板にあるLEDが点灯します。(結構時間がかかるので2-3分ぐらいかかっても目をつぶってください)

f:id:ueponx:20180501145833j:plain

一応、動作してくれました。ログ上にも成功(Succeeded)として表示されています。

f:id:ueponx:20180501150123p:plain

制御は成功したんのですが、これ点灯したLEDどうやって消そうw。

どうやって消灯させよう

基本的には、備忘的な表示灯なので一定時間ついていたら消灯するという感じでもいいのかなとは思いますが、Groveにはボタンもあるのでそれを使おうかと思っていました。ですが、ボタンの押下処理はWebSocketを使用するため、常時アクセスのようなものが必要になってしまいます。(Arduino化すればいいのかもしれないけど…後任が引き継げなくなるのでそれはやめたい。)

一定時間光ったり、点滅させることで今回は妥協しようかと思います。

IFTTTではループ処理などができなかったような気がしましたが、Microsoft Flowではループ処理も問題なく作成することができます。

こんな感じで処理を考えました。

  • メールの受信トリガー
  • カウンタ変数初期化
  • ループ処理(カウンタ値が5以上になったら抜ける)
    • リレーON
    • 5秒ウエイト
    • リレーOFF
    • 5秒ウエイト
    • カウンタ変数をインクリメント

上記にするためのポイントだけを抜粋します。

変数を追加する

フロー処理に変数を追加する場合にはアクションの追加で検索Boxに変数と入力します。

f:id:ueponx:20180501153354p:plain

変数のアクションの一覧から【変数の初期化】をクリックします。

f:id:ueponx:20180501153432p:plain

すると以下のように表示されるので、【名前】(変数名)【種類】(型)【値】(初期値)を設定していきます。

f:id:ueponx:20180501153504p:plain

今回は変数名をcount、型を整数、値を0として初期化を行いました。

f:id:ueponx:20180501153631p:plain

変数をインクリメントする

同様に定義した変数を更新するには フロー処理に変数を追加する場合にはアクションの追加で検索Boxに変数と入力します。

f:id:ueponx:20180501153354p:plain

変数アクションの中から【変数の値を増やす】などのアクションを選択します。

f:id:ueponx:20180501163940p:plain

すると以下のように表示が変更されるので

f:id:ueponx:20180501164100p:plain

既に定義済みの変数の値を変更する形になるので、【名前】には定義済みの変数名、【値】はインクリメントをする増分値を設定します。

先ほど作成した変数値を+1する場合には以下のような設定をすることになります。

f:id:ueponx:20180501164429p:plain

ループを生成する

ループを生成するには【新しいステップ】>【さらに追加】>【Do Untilの追加】を選択します。

f:id:ueponx:20180501154023p:plain

すると設定画面が表示されます。

f:id:ueponx:20180501154231p:plain

【値の選択】を行おうとするとこれまでに使用したトリガやアクションで使用されている値が候補として表示されます。今回はループ制御に先ほど初期化したcount変数を用いますので【以前の手順からパラメータを挿入】>【変数count】をクリックして選択を行います。

f:id:ueponx:20180501154510p:plain

クリックすると以下のようになります。

f:id:ueponx:20180501154646p:plain

今回は5回の処理を行うことを考えていたので以下のように設定を完了させます。

f:id:ueponx:20180501154818p:plain

ループの中の処理に関してはループ内の【アクションの追加】などを追加していくことになります。ちなみにBox内はループの処理、外部はループを抜けてからの処理になります。ループの外にある処理をドラッグ&ドロップして移動することも可能です。

f:id:ueponx:20180501155313p:plain

HTTPの処理をループ内にドラッグ&ドロップさせると

f:id:ueponx:20180501155144p:plain

上記のようになります。このようにして処理をネストさせていくことになります。

タイマー処理を行う(Delay)

タイマー処理のアクション名がスケジュールなのに気が付くまでに2時間ぐらいかかりました。タイマーとかの方が探しやすい…アクションの検索Boxにスケジュールと入力して候補を絞ります。

f:id:ueponx:20180501155439p:plain

その中から【スケジュール - 待ち時間】を選択すると

f:id:ueponx:20180501155500p:plain

以下のような設定画面になります。

f:id:ueponx:20180501155529p:plain

5秒間の待ち時間(wait)を今回は使用するため、以下のように設定しました。

f:id:ueponx:20180501155553p:plain

最終形

最終的な処理のフローはこんな感じになります。

f:id:ueponx:20180501164741p:plain

おわりに

一応、これでやりたいことはできた感じです。点灯と消灯の間隔を5秒にしていますが、処理時間にかなり誤差があります。それより短い値にしても動作に大きく変化がないので5秒としています。(この部分に関して言えば、正確さを求めてはいけないかなと思います)

長くなったので、回路部分に関しては次回のエントリーにしようと思います。

GoogleColaboratoryから希望するディレクトリにGoogleスプレッドシートを作成する

希望するディレクトリにGoogleスプレッドシートを作成する

前回のエントリーのなんとなく続きのエントリーになります。

uepon.hatenadiary.com

前回は意図したGoogleDriveのディレクトリにスプレッドシートを作成することができませんでした。作成できるのはルート(マイドライブ)の直下のみの制限付き。(gspreadの制限という感じですが…)

今回は、直接GoogleDriveの指定したパスに対してファイル(スプレッドシート)を作成し、以後そのスプレッドシートのKey(id)またはURLを別途取得してファイルを更新をするにはということを考えたいと思います。

使用するもの

今回はgspread以外にPyDriveというパッケージを使用することにしました。

pypi.python.org

github.com

PyDriveは以下のような機能を持っています。

  • Simplifies OAuth2.0 into just few lines with flexible settings.
  • Wraps Google Drive API into classes of each resource to make your program more object-oriented.
  • Helps common operations else than API calls, such as content fetching and pagination control.

簡単にいうとGoogleDriveの操作用のラッパーパッケージになります。こちらもわざわざGoogleDriveをマウントしなくてもファイル群を使えるので便利です。マウント作業とはいったい何だったのか!

PyDriveモジュールのインストール

PyDriveのインストールは以下のコマンドを実行すればOKです。

!pip install PyDrive

f:id:ueponx:20180406161707p:plain

無事にインストールできました。

基本的にはこれまでと同様に認証してからファイルへのアクセスを行うことになります。 ドキュメントをみると、以下のようなコードを実行すれば認証ができるということだったのですが、

from pydrive.auth import GoogleAuth
from pydrive.drive import GoogleDrive

gauth = GoogleAuth()
gauth.LocalWebserverAuth()

drive = GoogleDrive(gauth)

ちょっと書き換えをして以下の様にしてみました。

from pydrive.auth import GoogleAuth
from pydrive.drive import GoogleDrive
from google.colab import auth
from oauth2client.client import GoogleCredentials

# auth.authenticate_user()
gauth = GoogleAuth()
gauth.credentials = GoogleCredentials.get_application_default()
drive = GoogleDrive(gauth)

print('--- PyDrive Auth OK ---')

コードを実行してみるとこんな感じになります。

f:id:ueponx:20180408004235p:plain

恒例の認証処理を行っていきます。基本はクリック程度の作業で、一度行ってしまえばインスタンスが有効である間は認証の2回目以降省略されます。

まずは使用するアカウントを選択します。

f:id:ueponx:20180406183813j:plain

アカウントを選択したらGoogleDriveのアクセスへの許可を行います。【許可】ボタンをクリックします。すると以下の様な認証コードが表示されるので

f:id:ueponx:20180406183918j:plain

コードをコピーして

f:id:ueponx:20180407183436p:plain

Notebookのタブに戻って入力ボックスにこのコードをペーストして

f:id:ueponx:20180408004323p:plain

Enterキーを押します。

f:id:ueponx:20180407182758p:plain

これで認証は完了です。自由にGoogleDriveへアクセスができるようになっています。 以下のようにすればファイルの作成ができるようになります。

from pydrive.auth import GoogleAuth
from pydrive.drive import GoogleDrive
from google.colab import auth
from oauth2client.client import GoogleCredentials

auth.authenticate_user()
gauth = GoogleAuth()
gauth.credentials = GoogleCredentials.get_application_default()
drive = GoogleDrive(gauth)

print('--- PyDrive Auth OK ---')

file1 = drive.CreateFile({'title': 'Hello.txt'})
file1.SetContentString('Hello')
file1.Upload()

print('--- PyDrive CreateFile OK ---')

実行すると以下のようになります。

f:id:ueponx:20180407190133p:plain

正常に実行できました。あとはGoogleDriveにファイルが生成されているかを確認します。

f:id:ueponx:20180407184423p:plain

Hello.txtのファイルが無事にできていると思います。内容にも'''Hello```と入っているかなと思います。内容を簡単に説明するとファイルオブジェクトを作成しているのがCreateFile()、ファイルの内容のセットがSetContentString()、具体的なGoogleDriveファイルの生成処理がUpload()になっています。

うまく行ったかなと思うのですが…ちょっと気になる点があります。この処理を2回実行すると同名のファイルが2つ作成されてしました。 画像としては以下の様になります。

f:id:ueponx:20180407190447p:plain

そのままCreateFile()を行うとファイル名は同じですがKeyは異なるファイルが生成されるようです。別途上書きをするメソッドもなさそうです。 つまり、2回目以降のアクセスに関しては名前からファイルを作成するのではなく一意に振られるKeyやURLを使用する必要があります。

重複したファイルが生成されないようにするには?

いろいろ考えてみました。

簡単に考えると以下のような処理になるかなと。

  1. ファイルの所在を確認
  2. ファイルが所在していなければファイルを作成
  3. ファイルのKey(id)を取得
  4. Key(id)を使用してgspreadなどでスプレッドシートのファイルを開く
  5. スプレッドシートの編集

ファイルの所在の確認処理は、PyDriveを使って各ディレクトリを走査し、 ファイル一覧を取得していくことになります。また、ファイルの作成は、GoogleDriveディレクトリ構成を書くファイルの属性値として持っている構成なので、その中のparent_id属性に親フォルダのkey(id)を与えることで指定したディレクトリの下にファイルを作成することになります。

例えば/aaa/bbb/c.sheetなるファイルを処理する場合にはこうなるのかなと思います。

  1. マイドライブのファイルリストからaaaというディレクトリ名のkeyを取り出す
  2. 前の手順で取得したkeyをもとにマイドライブ/aaaのファイルリストからbbbというディレクトリ名のkey(id)を取り出す
  3. 前の手順で取得したkeyをもとにマイドライブ/aaa/bbbのファイルリストの中にc.sheetというファイルがあるか調べる
  4. c.sheetというファイルがなければファイルを作成する。(作成時にKey(id)が取得できるようになる)
  5. c.sheetというファイルがあればKey(id)が取得する
  6. 取得したスプレッドシートファイルのkey(id)を使ってgspreadを使用して処理を行う

もう少しロジックを考えてみた

とはいっても、GoogleDriveはフラットな構成なのでリスト取得は一回やればいいのかなと思うので以下の様に修正してみました。

  1. マイドライブのファイルリストを取得する
  2. ファイルリスト中にparentがマイドライブ(root)でありaaaという名前のディレクトリがあるか調べる
  3. ない場合にはフォルダを作成する
  4. aaaディレクトリのkeyを取得する
  5. ファイルリスト中にparentがkeyでありbbbという名前のディレクトリがあるか調べる
  6. ない場合にはフォルダを作成する
  7. bbbディレクトリのkeyを取得する
  8. ファイルリスト中にparentがkeyでありc.sheetという名前のファイルがあるか調べる
  9. c.sheetというファイルがなければファイルを作成する
  10. c.sheetのkeyを取得する
  11. 取得したスプレッドシートファイルのkeyを使ってgspreadを使用して処理を行う

処理が増えたような気がしますが単純になったこととリストを何回も取得しなくて良くなった点はよいのかなと思います。

このロジックから以下のようなidの取得までのコードをかいてみました。(途中のパス(ディレクトリ)でエラーが発生した場合の対応できてません)

from pydrive.auth import GoogleAuth
from pydrive.drive import GoogleDrive
from google.colab import auth
from oauth2client.client import GoogleCredentials

auth.authenticate_user()
gauth = GoogleAuth()
gauth.credentials = GoogleCredentials.get_application_default()
drive = GoogleDrive(gauth)

print('--- PyDrive Auth OK ---')

def get_id(path_str):

  fileDict = {}

  file_list = drive.ListFile({'q': "trashed=false"}).GetList()
  for f in file_list:
    if(len(f['parents']) != 0): # 他のユーザからの共有ファイルはparents属性がない。
      # print('title: %s, id: %s, parent_id %s' % (f['title'], f['id'], f['parents'][0]['id']))
      tmp = {'title':f['title'], 'ID':f['id'], 'parentsID':f['parents'][0]['id']}
      fileDict[f['title']] = tmp

  #for key, value in fileDict.items():
  #  print(key, value)

  path_str_list = path_str.strip('/').split('/')

  print('-> pathList:')
  for i,p in enumerate(path_str_list):
    if(p in fileDict):
      print(fileDict[p])
    else:
      print('ファイル新規作成')
      nf = drive.CreateFile({'title': p, 'mimeType': 'application/vnd.google-apps.spreadsheet', 'parents': [{'kind': 'drive#parentReference', 'id': fileDict[path_str_list[i-1]]['ID']}]})
      nf.Upload()
      return nf['id']
  else:
    return fileDict[p]['ID']
  
path_string = "/Colab Notebooks/sample/SpreadSample"
d = get_id(path_string)
print('id = %s' % d)

注意点としてはファイルの作成時にMime-Typeを指定していないとスプレッドシートファイルを作成できない点でしょうか。具体的に抜き出すとこの処理になります。

nf = drive.CreateFile({'title': p, 'mimeType': 'application/vnd.google-apps.spreadsheet', 'parents': [{'kind': 'drive#parentReference', 'id': fileDict[path_str_list[i-1]]['ID']}]})

ここ実行するとこんな感じになります。

f:id:ueponx:20180421143800p:plain

スプレッドシートもできています。

f:id:ueponx:20180421144103p:plain

ちなみに2回目の実行をおこなってみたのですが、新規作成は行われませんでした。

f:id:ueponx:20180421145246p:plain

f:id:ueponx:20180421145428p:plain

一応、無事に動作できたようです。

終わりにというか、追記

今回はこんなロジックでつくってみたのですが、GoogleDriveのファイル数多くある場合にはかなり遅くなります。そのため、最初に作成したロジックのものも作ってみました。ファイル数が多い場合にはこちらのほうが有効かもしれません。

from pydrive.auth import GoogleAuth
from pydrive.drive import GoogleDrive
from google.colab import auth
from oauth2client.client import GoogleCredentials

auth.authenticate_user()
gauth = GoogleAuth()
gauth.credentials = GoogleCredentials.get_application_default()
drive = GoogleDrive(gauth)

print('--- PyDrive Auth OK ---')

# ファイルのPathからIDを検索する
def get_id_list(path_str):

  # parentsのidで検索してフォルダ、ファイル名が一致するオブジェクトのidを返す
  def find_path_id(parent_id, name):
    file_list = drive.ListFile({'q': "'%s' in parents and trashed=false" % parent_id}).GetList()
    for f in file_list:
      if (f['title']==name):
        return f['id']
  
  path_str_list = path_str.strip('/').split('/')
  parent_id_dict = {}
  filename = path_str_list[-1]
      
  print('---Process---')
  parent_id = 'root'
  for p in path_str_list:
    current = p
    # print('parent_id: %s current: %s' % (parent_id, current))
    parent_id_dict[current] = parent_id
    parent_id = find_path_id(parent_id, current)
  print('<-- parent_id -->: %s <-- current -->: %s' % (parent_id , current))
  if(parent_id == None):
    print('ファイル新規作成')
    print('<-- parent_id -->: %s <-- filename -->: %s' % ((parent_id_dict[filename]), filename))
    f = drive.CreateFile({'title': filename, 'mimeType': 'application/vnd.google-apps.spreadsheet', 'parents': [{'kind': 'drive#parentReference', 'id': parent_id_dict[filename]}]})
    f.Upload()
    # print(f['id'])
    return f['id']
  else:
    id = find_path_id(parent_id_dict[filename], filename)
    # print(id)
    return id
  
path_string = "/Colab Notebooks/sample/SpreadSample"
try:
  d = get_id_list(path_string)
  print('id = %s' % d)
except:
  print('raise exception')

1回目の実行 f:id:ueponx:20180421153831p:plain

2回目の実行 f:id:ueponx:20180421153910p:plain

あとはこのkey(id)を使用して、以下のようなコードを追記してあげると

import gspread

gc = gspread.authorize(GoogleCredentials.get_application_default())
sh = gc.open_by_key(key)
worksheet = sh.get_worksheet(0)

# set value
worksheet.update_acell('A1', 'foo')

# set values
cell_list = worksheet.range('A2:C3')
for cell in cell_list:
    cell.value = 'bar'

worksheet.update_cells(cell_list)

# get value
val = worksheet.acell('A1').value
print(val)

# get value
val = worksheet.cell(2, 2).value # B2 cell
print(val)

実行するとこんな感じでちゃんと動作していました。

f:id:ueponx:20180421161053p:plain

スプレッドシートにもちゃんと値も設定されていますし、値も取得できました!

f:id:ueponx:20180421161135p:plain

一応、やりたいことはできたのですがかなり辛かった…多分もっと簡単な方法があるに違いない。

【参考】

uepon.hatenadiary.com uepon.hatenadiary.com uepon.hatenadiary.com uepon.hatenadiary.com

Google ColaboratoryでGoogleスプレッドシートを読み書きしてみる

Google ColaboratoryでGoogleスプレッドシートを読み書きしてみる

前回のエントリでは、GoogleColabで画像表示ができるようになりました。これでOpenCVを使った画像処理も安心して勉強ができるようになりました。

uepon.hatenadiary.com

では、そのほかのファイル、特にWebスクレイピングをした結果をGoogleスプレッドシートに格納といった用途はあるかなと思います。 具体的にはセルから値を取り出したり、格納したりとなりますが、それができるかを確認してみようと思います。

f:id:ueponx:20180408110634p:plain

必要になるパッケージ

GoogleColabというかpythonGoogleスプレッドシートのファイルを扱うには‘‘‘gspread‘‘‘というモジュールを用いると便利です。

github.com

特徴としては…

  • Google Sheets API v4.
  • Open a spreadsheet by its title or url.
  • Extract range, entire row or column values.
  • Python 3 support.

python3に対応しているので助かります。また、スプレッドシートを開く際にはファイル名(タイトル)かURLが指定できるので、共有設定の入っているようなGoogle Drive上のスプレッドシートに関してもデータの操作が行えるのが便利です。

gspreadパッケージのインストール

以下のコマンドでインストールすることができます。

!pip install gspread

既にインストール済みであれば-Uつけてインストールしますが今のところ不要の様です。

f:id:ueponx:20180406161141p:plain

このように表示されればインストールは完了です。

gspreadパッケージを使用することで以前のエントリーのような特別なGoogle Driveディレクトをマウントする作業なしで(というかこのパッケージとgoogle.colabパッケージ、oauth2clientパッケージを使用することで、直接Google Driveへアクセスする事ができます)

python側の標準的なファイルアクセス処理を行う場合にはマウントすることにもメリットはありますが、Googleスプレッドシートを単に読み込んだりするだけであればgspreadパッケージを使用するほうが楽かもしれません。(認証作業の回数も減りますし)

基本的な操作

基本的な操作としてはGithubのパッケージのドキュメントで抑えられると思いますが、念のため。

github.com

以下のテストの実行にあたっては、事前にマイドライブ上SpreadsheetSampleというスプレッドシートファイルを作成しておきます。存在しないとエラーが出ます!

Google Drive上は以下のような感じになっていて

f:id:ueponx:20180406162730p:plain

ファイルは存在していればよいので、ワークシートは空で大丈夫です。

f:id:ueponx:20180406183020p:plain

ではNotebookに以下のコードを張り付けて実行してみます。 内容としてはファイルをオープンして指定したセルに値を格納し、格納後さらに値を取得するという単純なものです。

from google.colab import auth
from oauth2client.client import GoogleCredentials
import gspread

# 認証処理
auth.authenticate_user()
gc = gspread.authorize(GoogleCredentials.get_application_default())

# 'SpreadsheetSample'というスプレッドシートの先頭ワークシートをオープン
worksheet = gc.open('SpreadsheetSample').get_worksheet(0)

# A1セルに'foo'という値を上書き
worksheet.update_acell('A1', 'foo')

# A2からC3のセルエリアに'bar'を一括で上書き
cell_list = worksheet.range('A2:C3')
for cell in cell_list:
    cell.value = 'bar'
worksheet.update_cells(cell_list)

# A1セルの値を取得し、表示
val = worksheet.acell('A1').value
print(val)

# A1セルを0,0とするようなセル指定で
# 2,2(B2)の位置のセルを取得
val = worksheet.cell(2, 2).value
print(val)

このコードを【Shift】+【Enter】で実行します。

すると、認証処理が実行されます。(一度認証すればインスタンス実行中は認証処理は不要の様です)

f:id:ueponx:20180406183720j:plain

認証用のURLと認証キーのinputboxが表示されるので、URLのリンクをクリックします。 すると使用するDriveのアカウント選択に遷移します。

f:id:ueponx:20180406183813j:plain

使用するアカウントを選択すると、使用可能な機能の確認画面に遷移します。

f:id:ueponx:20180406183918j:plain

問題ないかを念のため確認して【許可】ボタンをクリックします。すると画面が遷移し、認証キーが発行されるのでこれを コピーして、Notebookのタブへ移動します。

f:id:ueponx:20180406184041j:plain

あとは認証キーをinputboxに張り付けて

f:id:ueponx:20180406184147j:plain

【Enter】キーを押せば認証が完了します。認証の完了後はPythonのコードが実行され結果表示に以下のような表示がされれば 正常に実行できました。

【実行結果】

foo
bar

f:id:ueponx:20180406163443p:plain

では、スプレッドシートの中身を確認してみます。

f:id:ueponx:20180406184524p:plain

A1のセルに'foo'が入っていて、A2-C2、A3-C3の領域に'bar'が格納されていれば正常に動作しています。 これでスプレッドシートの値の取得や格納もNotebookのコードから実行ができるようになりました。 意外と簡単にできました。

マイドライブ以外のディレクトリに存在する既存のスプレッドシートを開いてみる

先ほどはマイドライブ内にあるスプレッドシートのファイル名を指定して開きましたが、今度は任意のフォルダにあるスプレッドシートを開いてみます。 マイドライブの下にsheetディレクトリを作成し、その中にsampleというスプレッドシートファイルを作成します。

以下の画面のような状況になります。

f:id:ueponx:20180406193026p:plain

f:id:ueponx:20180406193114p:plain

ではこれを開いてみます。

エラーの例(読まなくても問題ないので飛ばしましょう)

単純に以下のようなコードでいいのかなと思うのですが…

from google.colab import auth
from oauth2client.client import GoogleCredentials
import gspread

# 認証処理
auth.authenticate_user()
gc = gspread.authorize(GoogleCredentials.get_application_default())

# 'マイドライブ/sheet/sample'というスプレッドシートの先頭ワークシートをオープン
worksheet = gc.open('./sheet/sample').get_worksheet(0)```

ダメです。エラーがでます。

f:id:ueponx:20180406193657p:plain

エラーメッセージとしてはSpreadsheetNotFound:となっているのでパス指定に問題がありそうです。 何回か実験してみたのですが、python上でカレントディレクトリの変更をしたりしてみたのですが、パス指定を変えることが出来なさそうです。 Google Drive上のファイルは名前の方やパスを属性として扱い、基本的にはツリー構造ではなくフラットな構造になっているため、 基本はファイルの所在としてはマイドライブの下にあるのも、ある特定のディレクトリにあることも大きな差がないということの様です。

うまくいった例

前のエラーを踏まえて、ではどうするか?

ファイルをオープンする方法としてgspreadモジュールではkeyをしてする方法とURLから指定する方法があるようです。 ドキュメントには以下のような記述があります。

# If you want to be specific, use a key (which can be extracted from
# the spreadsheet's url)
sht1 = gc.open_by_key('0BmgG6nO_6dprdS1MN3d3MkdPa142WFRrdnRRUWl1UFE')

# Or, if you feel really lazy to extract that key, paste the entire url
sht2 = gc.open_by_url('https://docs.google.com/spreadsheet/ccc?key=0Bm...FE&hl')

Google Driveに格納されるファイルには固有のキーがあるのでそれを使用するようです。URLも基本的には固有キーを使用したURLになっているので同じような感じです。 つまりキーがわかっていれば問題ありません。

ファイルの固有キーをつかって任意のフォルダのスプレッドシートへアクセス

スプレッドシートをブラウザで開いて

f:id:ueponx:20180406201013p:plain

ブラウザのURL表示の中の https://docs.google.com/spreadsheets/d/14TU4**********************************************Hxt1Y/edit#gid=0(自分のファイルのものを使用してください)

/d/のあとから次の/までの間が固有キーになります。それを使用して以下のようなスクリプトを実行します。

from google.colab import auth
from oauth2client.client import GoogleCredentials
import gspread

# 認証処理
auth.authenticate_user()
gc = gspread.authorize(GoogleCredentials.get_application_default())

# 'マイドライブ/sheet/sample'というスプレッドシートをオープン
sh = gc.open_by_key('14TU4**********************************************Hxt1Y')
worksheet = sh.get_worksheet(0)

# set value
worksheet.update_acell('A1', 'key')

f:id:ueponx:20180406201547p:plain

スプレッドシートにも反映されています。

f:id:ueponx:20180406201640p:plain

URLをつかって任意のフォルダのスプレッドシートへアクセス

スプレッドシートをブラウザで開いて

f:id:ueponx:20180406194727p:plain

ブラウザのURLボックスの中身がそのままURLになります。(URLの末尾に/edit#gid=0がついています。本来はないものが正しいURLですが、末尾に編集情報がついていても問題はないようです)

f:id:ueponx:20180406201055p:plain

このURLをつかってスプレッドシートへアクセスします。 以下のコードを実行します。

from google.colab import auth
from oauth2client.client import GoogleCredentials
import gspread

# 認証処理
auth.authenticate_user()
gc = gspread.authorize(GoogleCredentials.get_application_default())

# 'マイドライブ/sheet/sample'というスプレッドシートをオープン
sh = gc.open_by_url('https://docs.google.com/spreadsheets/d/14TU4**********************************************Hxt1Y/edit#gid=0')
worksheet = sh.get_worksheet(0)

# set value
worksheet.update_acell('A1', 'URL')

実行結果・編集したスプレッドシートがこのように変化すれば正常に実行されています。

f:id:ueponx:20180406201917p:plain

f:id:ueponx:20180406202020p:plain

オープン処理はできました

これで既存にあるスプレッドシートのファイルに関してはおおよそ処理できるようになりました。 これでもいいのですが…新規にファイルを作成することだってありますよね?

スプレッドシートの作成

先ほどの例ではあらかじめあるスプレッドシートを読み込んでいましたが、今度は新規に作成してみようと思います。

新規にスプレッドシートを作成してみる

マニュアルをみると以下のような記述で大丈夫のようです。

sh = gc.create('test_sheet')

では新規作成してみましょう。新規作成するスプレッドシートの名前は'test_sheet'にしてみます。

from google.colab import auth
from oauth2client.client import GoogleCredentials
import gspread

# 認証処理
auth.authenticate_user()
gc = gspread.authorize(GoogleCredentials.get_application_default())

# 'SpreadsheetSample'というスプレッドシートの先頭ワークシートをオープン
worksheet = gc.create('test_sheet').get_worksheet(0)

# A1セルに'foo'という値を上書き
worksheet.update_acell('A1', 'Create')

# A1セルの値を取得し、表示
val = worksheet.acell('A1').value
print(val)

このコードを実行すると以下のようになります。

f:id:ueponx:20180406203817p:plain

作成されたのはマイドライブの直下に作成されています。

f:id:ueponx:20180406204016p:plain

スプレッドシートのセルも期待通り編集されています。

f:id:ueponx:20180406204119p:plain

これでめでたしめでたし…となるはずなんですが、やっぱりなんとなくしっくりきません。 時系列のデータをファイルを作りつつ保存するような処理をするほうが比較的一般的ではないかと思います。

と入っても、gspreadモジュールでできるのは以下の2つになります。

  • マイドライブ直下へのファイル作成(open()、open_by_url()、open_by_key())
  • マイドライブ・任意のディレクトリのスプレッドシートへのアクセス処理(create())

どうやらgspreadモジュールだけでは難しいようです。

終わりに

長くなったのでこのあとは別のエントリーにしようと思います。 次回はディレクトリを指定してスプレッドシートの読み書きを作成するにはという感じになると思います。 (途中まで書いていてあまりにも長く感じたので分けました)

これまで、あんまりネットワーク上のストレージを使ったプログラムを使ったことがなかったので結構戸惑ったような感じでしたが、 こういう考え方や扱いがむしろ普通になってきているんしょうね。

【関連エントリ】

uepon.hatenadiary.com

uepon.hatenadiary.com

uepon.hatenadiary.com

Google Colaboratoryで画像表示してみる

Google Colaboratoryで画像表示してみる

最近、やっているGoogle Colaboratory関連のエントリーの続きです。

uepon.hatenadiary.com

uepon.hatenadiary.com

Google ColaboratoryOpenCVを使おうと思っていましたが、このあたりの書き方がJupyter Notebookとはちょっと違うようだったのでメモ。

作業を始めてわかったのですが

f:id:ueponx:20180328194454p:plain

ファイルを確認すると「空」でした!

このように、前回のエントリーでインスタンスに接続したGoogle Driveのマウントは消えています。またファイルアップロードを過去に行っていても そのファイルもなくなるようです。つまり、インスタンス起動の制限時間内に収まらなかった場合、最後の状態が保持されるわけではないようです。 過去のエントリーにも追加が必要ですね。(初期インスタンスイメージをロードする感じなんでしょうね)

マウント処理は毎回やらないとダメそうですね…

ファイルをアップロードして表示を行う

では、前回のエントリー同様にファイルアップロードを行ってみます。

from google.colab import files
uploaded = files.upload()

f:id:ueponx:20180328195529p:plain

これでapple.jpgという画像ファイルをアップロードすることができました。 では、画像ファイルを表示してみます。

notebookで単純に画像を表示するならIPython.displayモジュールのdisplay_*メソッドが使えるようです。

IPythonとは、Pythonの対話型インタプリタを強力に拡張したもののようです。

  • 強力なインタラクティブシェル
  • Jupyterのカーネル
  • インタラクティブなデータの視覚化とGUIツールキットの使用をサポート
  • フレキシブルで埋め込み可能な通訳者が自分のプロジェクトに読み込み
  • 使いやすい、並列コンピューティングのための高性能ツール

以上のような機能があります。notebook上で保管がモジュールの保管が聞くのもこのおかげのようです。

ドキュメントをみると

f:id:ueponx:20180328203445p:plain

こんなふうな感じです。jpegの他にもHTML、pdf、pngSVGmarkdownなんかも表示ができるようです。 では実行してみましょう。

from IPython.display import Image,display_jpeg
display_jpeg(Image('apple.jpg'))

f:id:ueponx:20180328204610p:plain

無事に画像が表示されました。 pngの場合にはdisplay_jpeg()の代わりにdisplay_png()とするような感じです。

from IPython.display import Image,display_png
display_png(Image('Lenna.png'))

f:id:ueponx:20180328205307p:plain

こんな感じで実行できます。

透過色があっても問題ありません!

f:id:ueponx:20180328205547p:plain

背景が黒だとこんな風に見えます。

f:id:ueponx:20180328205739p:plain

SVGファイルもこのような感じで表示できます。

from IPython.display import *
display_svg(SVG('svg.svg'))

SVGの場合にはImageオブジェクトではなくSVGオブジェクトを引数にする必要があります。

f:id:ueponx:20180328232838p:plain

pdfとmarkdownはうまく行かなかったみいです。(純粋なJupyterNotebookでは動くかもですが…ちょっと自信ないです)

f:id:ueponx:20180328234512p:plain

そんなことをやりたかったわけではない

そうでした。本当にやりたかったのはOpenCVで処理した結果をGoogle Colabで表示したいのでした。 ということで、OpenCVで使ったサンプルをGoogleColabで実行してみると…

import cv2

img = cv2.imread('Lenna.png', 0)

cv2.imshow('image',img)
cv2.waitKey(0)
cv2.destroyAllWindows()

おや?

f:id:ueponx:20180328235539p:plain

インスタンスの異常終了をして、再起動までされてしまいました。うお。 調べてみるとNotebookで実行するのであればインライン(コマンドの出力)での出力にしないとまずいようです。 つまり先程のサンプルでは別ウインドウで画像を開こうとしているという点が失敗の原因になっていたということです。

今回はグラフなどの描画でもちいるmatplotlibOpenCVの結果を渡すことでNotebook環境(インライン)で表示することにします。 %matplotlib inlineを指定(出力先をインラインに指定)しないとだめそうなのですがうまく行っています。

import cv2
import matplotlib.pyplot as plt
import os.path

file = 'apple.jpg'
if os.path.exists(file):
  img = cv2.imread(file)
  show_img = cv2.cvtColor(img, cv2.COLOR_BGR2RGB) 
  plt.imshow(show_img)

f:id:ueponx:20180329000846p:plain

修正点としてはcv2からmatplotlib.pyplotに変更した点が大きく違います。ちゃんと設定をすれば座標軸などは消すことはできますので安心してください。

import cv2
import matplotlib.pyplot as plt
import os.path

# 座標軸の削除処理
fig,ax = plt.subplots()
ax.tick_params(labelbottom="off",bottom="off")
ax.tick_params(labelleft="off",left="off")
ax.set_xticklabels([]) 
ax.axis('off')

file = 'apple.jpg'
if os.path.exists(file):
  img = cv2.imread(file)
  show_img = cv2.cvtColor(img, cv2.COLOR_BGR2RGB) 
  plt.imshow(show_img)

f:id:ueponx:20180329002042p:plain

ファイルの書き込みもOpenCVの‘‘‘imwrite()‘‘‘メソッドでOKです。

import cv2 as cv
import matplotlib.pyplot as plt

fig,ax = plt.subplots()
ax.tick_params(labelbottom="off",bottom="off")
ax.tick_params(labelleft="off",left="off")
ax.set_xticklabels([]) 
ax.axis('off')

img = cv.imread('Lenna.png', cv.IMREAD_GRAYSCALE)
cv.imwrite('Lenna_Gray.png', img)
plt.imshow(img)

f:id:ueponx:20180329002427p:plain

では画像を加工していくつかの表示を行いたい場合にはどうすればいいでしょうか。 いくつかの手法はあるのですが、今回は一つのfigure(枠)に複数のaxes(グラフ)をはりつけるという方法で実現をしようと思います。 OpenCVでタイル状に合成するのもいいですが、見た目がわかりにくいこともあるのでこちらの手法にしました。

今回はカラー画像とグレースケール化画像を並べて表示してみます。

import cv2 as cv
import matplotlib.pyplot as plt
import os.path

def clearLabel(_ax):
  _ax.tick_params(labelbottom="off",bottom="off")
  _ax.tick_params(labelleft="off",left="off")
  _ax.set_xticklabels([]) 
  _ax.axis('off')
  return _ax

def readImage(_filename):
  if os.path.exists(_filename):
    img = cv.imread(_filename)
    return img

img = readImage('Lenna.png')
  
fig = plt.figure()

ax1 = fig.add_subplot(1, 2, 1)
clearLabel(ax1)
show_img1 = cv.cvtColor(img, cv.COLOR_BGR2RGB) 
plt.imshow(show_img1)

ax2 = fig.add_subplot(1, 2, 2)
clearLabel(ax2)
show_img2 = cv.cvtColor(img, cv.COLOR_BGR2GRAY) 
plt.imshow(show_img2)

plt.show()

f:id:ueponx:20180330181005p:plain

ポイントとなるのは以下の部分です。

fig = plt.figure() # figureの作成
ax1 = fig.add_subplot(1, 2, 1) # 1 rows 2 columnsの1columns目のaxes(向かって左側に表示される画像)をax1に代入
…
ax2 = fig.add_subplot(1, 2, 2) # 1 rows 2 columnsの2columns目のaxes(向かって右側に表示される画像)をax2に代入

今回はfigure(枠)に2つの画像(axes(グラフ))を左右に並べるので1 rows 2 columns(1行2列)のfigureを作成して画像を配置することになります。 今回は左右に並べましたが、上下にするのであればパラメータを少し変更して

import cv2 as cv
import matplotlib.pyplot as plt
import os.path

def clearLabel(_ax):
  _ax.tick_params(labelbottom="off",bottom="off")
  _ax.tick_params(labelleft="off",left="off")
  _ax.set_xticklabels([]) 
  _ax.axis('off')
  return _ax

def readImage(_filename):
  if os.path.exists(_filename):
    img = cv.imread(_filename)
    return img

img = readImage('Lenna.png')
  
fig = plt.figure()

ax1 = fig.add_subplot(2, 1, 1) #変更
clearLabel(ax1)
show_img1 = cv.cvtColor(img, cv.COLOR_BGR2RGB) 
plt.imshow(show_img1)

ax2 = fig.add_subplot(2, 1, 2) #変更
clearLabel(ax2)
show_img2 = cv.cvtColor(img, cv.COLOR_BGR2GRAY) 
plt.imshow(show_img2)

plt.show()

f:id:ueponx:20180330182209p:plain

こんな感じになりました。パラメータ次第で以下のようにも表示可能です。

f:id:ueponx:20180330182337p:plain

おわりに

これで目的は達成できたかなと思います。

おまけですが、URLを指定して画像をダウンロードし、表示をさせる場合にはrequestsモジュールを使用すれば可能です。 以下のような感じで一応できました(もっときれいに書いたほうがいいけど)

import requests
import cv2 as cv
import matplotlib.pyplot as plt
import os.path

def clearLabel(_ax):
  _ax.tick_params(labelbottom="off",bottom="off")
  _ax.tick_params(labelleft="off",left="off")
  _ax.set_xticklabels([]) 
  _ax.axis('off')
  return _ax

def readImage(_filename):
  if os.path.exists(_filename):
    img = cv.imread(_filename)
    return img

response = requests.get('https://upload.wikimedia.org/wikipedia/commons/e/e1/Harvest_of_MIKAN.jpg', allow_redirects=False)
if response.status_code != 200:
  e = Exception("HTTP status: " + response.status_code)
  raise e

content_type = response.headers["content-type"]
if 'image' not in content_type:
  e = Exception("Content-Type: " + content_type)
  raise e
  
with open('mikan.jpg', "wb") as fout:
  fout.write(response.content)
  
img = readImage('mikan.jpg')

fig = plt.figure()
ax = fig.add_subplot(1, 1, 1)
clearLabel(ax)
show_img = cv.cvtColor(img, cv.COLOR_BGR2RGB) 
plt.imshow(show_img)

f:id:ueponx:20180330184350p:plain

Google Colab上でOpenCVを使って画像処理(画像表示)ができるようになりました。 Googleスプレッドシートに画像のURLを指定して画像を保存、加工、表示するところまでは比較的簡単にできそうですね。 次はGoogleスプレッドシートの読み込みですかね。

関連エントリー

uepon.hatenadiary.com uepon.hatenadiary.com

Microsoft Cognitive Services の Custom Visionを使用して画像の判別エンジンを作成してみた

Microsoft Cognitive Services の Custom Visionを使用して画像の判別エンジンを作成する

Microsoft Cognitive Services の Custom Vision は、オリジナルの画像判定エンジンを作成して推定できるサービスです。 画像判定ロジックを構築しなくても、画像をアップロードし、事前にタグ付けを行うことで、画像判定エンジンを構築することができます。 ここで作成した画像判定エンジンはAPI経由でアクセスすることもできます。

IBM Cloud(旧Bluemix)やGCPGoogle Cloud Platform)でもできるようですが、まずは自分はこちらから試してみます。

本エントリーでは以前参加した

cogbot.connpass.com

では、イベントの運営のお手伝いをしていたのでハンズオンの内容はほとんど手を付けられなかったため、復習も兼ねてみたという感じです。

なお、以下を参考にさせていただきながら復習しています。

qiita.com

Custom Vision ポータルへ

まずはMicrosoft アカウントが必要になりますので事前に準備が必要になります。

準備が終わったらCustom Vision ポータルにアクセスします。

すると以下のような画面になります。

f:id:ueponx:20180324214334j:plain

画面の中央にある、【SIGN IN】ボタンをクリックします。

f:id:ueponx:20180324215000j:plain

Microsoftアカウントのログインを促されます、ログインをする以下のようなアクセス許可を求められますので、内容を確認して 【はい】ボタンをクリックします。すると次のような画面に遷移します。

f:id:ueponx:20180324215347j:plain

こちらでもサービスに対する同意を求められます。チェックボックスにチェックをいれて下にある【I agree】ボタンをクリックします。

f:id:ueponx:20180324215610j:plain

自分の場合にはAzureのアカウントと紐付けがされてないよーって感じの以下の表示になりました。(bizSparkサブスクリプションを使っていたので、ちょっとあれって感じでした)。

f:id:ueponx:20180324220334j:plain

ここで【Sign up for Azure】ボタンをクリックすると従量課金のサインアップへ進みます。

f:id:ueponx:20180324220731j:plain

支払いは発生しないがカードの登録はしないといけないのかなと思ったのですが、従量課金サブスクリプションと紐づけられるとなんとなく不安になるので、にわかの自分は画面中の【I'll do it later】を選択します。こちらは制限はプロジェクト数の制限があること、アクセス数の制限はありますが、いまは問題ないと思います。

Custom Vision のProjectの作成

では実際にProjectを作成します。画像の判別を行う機能はProjectという単位で作成するようです。

先ほどまでの作業が終わると以下のような画面になっていると思います。

f:id:ueponx:20180324220714j:plain

【New Project】という大きいボタンをクリックします。するとProjectの設定画面が表示されます。

f:id:ueponx:20180324220827j:plain

設定に必須となるのはNameだけです、あとはオプションになる感じです。参考にしたエントリーでは食べ物の判定を行っていたので適当にFoodFinderとしました。 Domainも食べ物関係ということでFoodに設定しています。(特に指定がない場合にはGeneralになるのかな?) 設定が終わったら、画面下にある【Create project】ボタンをクリックします。すると、以下のような画面に遷移します。

f:id:ueponx:20180324221458j:plain

これでプロジェクトの作成は終わりました。あとはこのプロジェクトに画像をアップロードとタグ付けをしていきます。

学習データ画像のアップロードとタグ付け

f:id:ueponx:20180324221458j:plain

画面内中央にある【Add images】ボタンをクリックしてローカルにある画像をアップロードしていきます。

f:id:ueponx:20180324222231j:plain

クリックすると画面の右側にペインが表示されます。その中の【Browse local files】ボタンをクリックします。するとファイル選択のダイアログが開きます。(今回は参考にしたエントリーに事前に準備された画像を使用しています)

画像ファイル

f:id:ueponx:20180324222301j:plain

ファイルを選択して【開く】ボタンをクリックします。(1枚づつでも、まとめてでも指定することはできます)ある程度カテゴリ化された画像であればまとめて行ったほうがいいかなと思います。

f:id:ueponx:20180324222727j:plain

次は指定した画像にタグ付けをする作業になります。(指定した画像にまとめてタグ付けをしていきます)今回はカレーの画像を設定したのでタグには【curry】を設定していきます。タグを入力したら【+】ボタンをクリックするとタグが追加されます。複数のタグの設定ができようです。

f:id:ueponx:20180324223313j:plain

入力ボックスの下部に入力したタグが表示されていればOKです。タグ付けが完了したら画面したにある【Upload 7 files】(数字は指定したファイル数になります)をクリックします。

作業用のペインに戻りますので【Done】ボタンをクリックします。 すると、画面が以下のように変わります。これで無事にトレーニング用のデータに追加が行われました。

あとは、これを繰り返していくだけです。

最終的には以下のような登録状態になります。

f:id:ueponx:20180324223905j:plain

あとは画像の判別の学習(トレーニング)のプロセスを行えばおおむね終了です。

学習(トレーニング)をさせる

画面上部の緑色の【Train】ボタンを押せばOKです。

f:id:ueponx:20180324223905j:plain

あとは時間が解決してくれます。

トレーニングが終了すると画面がこんな感じに変化します。

  • Iterationは「反復」
  • Precisionは「精度」
  • Recallは「呼び返す」

これで学習完了です。あとはその結果を楽しむだけです。

学習の結果を調べてみる

学習後には画面上部にある【Train】の隣に【Quick Test】のボタンがアクティブになります。

f:id:ueponx:20180324225017j:plain

これをクリックすると画面が以下のように遷移します。

f:id:ueponx:20180324225208j:plain

学習した判別エンジンに対して画像を与えて、どのグループに所属するかの推定結果を返してくれます。 URL経由で画像を渡すことができますし、ローカルファイルをアップロードして判別することもできます。 今回はサンプルについていた「お寿司」の画像をアップロードしてみます。【Browse local files】のボタンをクリックして ファイル選択ダイアログからファイルを選択してアップロードを行えば下記のような結果が画面に表示されます。

f:id:ueponx:20180324225645j:plain

これで画像の判別エンジンを作ることができました。事前の作業のほうがめんどくさいぐらい簡単にできてしまいます。

今後は画像をうまく集めることが今後の課題になりそうですね。

APIでアクセスするには?

ここでできた画像判別エンジンをREST API経由でも操作したいと思いますよね? その時の情報は画面内にある【PERFORMANCE】タブの中にある【Prediction URL】をクリックするとアクセスに必要な情報が得られます。

f:id:ueponx:20180324230138j:plain

クリックすると

f:id:ueponx:20180324230222j:plain

エンドポイントのURLやアクセスに必要なPredicton-Keyの情報を得ることができます。

おわりに

これでMicrosoft Cognitive Services の Custom Visionが一応つかえるようになりました。次はIBM Cloudでも使えるようになりたいです。 その前にこれを使って性能を計ってみたいですね。

/* -----codeの行番号----- */