MRが楽しい

MRやVRについて学習したことを書き残す

公式チュートリアル「MR and Azure 302 8~10章」を試してみる

本日はチュートリアルの実施枠です。
Academyの「MR and Azure 302: Computer vision」の実施内容をまとめます。
docs.microsoft.com
前回記事の続きです。
bluebirdofoz.hatenablog.com
今回は「Chapter 8 ~ Chapter 10(完成)」です。

Chapter 8:Before building

アプリケーションのテストを行うには、HoloLensにロードする必要があります。
ビルド作業を行う前に、次のことを確認してください。
・第2章で説明したすべての設定が正しく設定されています。
・全ての作成したスクリプトは Script オブジェクトに添付されています。
・Script オブジェクトの Inspector パネルの全てのフィールドが正しく割り当てられています。
f:id:bluebirdofoz:20180815094657j:plain
・VisionManager クラスの authorizationKey 変数に認証キーを設定しています。
・VisionManager クラスの visionAnalysisEndpoint 変数に正しいリージョンの URL を設定しています。

Chapter 9:Build the UWP Solution and sideload the application

Unityセクションで必要なものは全て完成したので、ビルドを行います。
1.メニューから File -> Build Settings を選択します。
f:id:bluebirdofoz:20180815094708j:plain

2.「Unity C# Projects」をチェックし、「Build」を実行します。
f:id:bluebirdofoz:20180815094937j:plain

Chapter 10:Deploy to HoloLens

アプリケーションを HoloLens に展開します。
1-4.ビルドで出力された sln ファイルを開きます。
構成を「Release」「x86」「リモートコンピュータ(HoloLensのIPアドレス)」に変更します。
f:id:bluebirdofoz:20180815094948j:plain

4.メニューから デバッグ -> デバッグなしで実行 でアプリを HoloLens にインストールして実行します。
f:id:bluebirdofoz:20180815094959j:plain

5.HoloLens 上で動作確認を行います。
タップ操作と共にキャプチャが行われ、目の前に見えるものの分析結果のタグ一覧が表示されます。
f:id:bluebirdofoz:20180815095013j:plain

以上で HOLOGRAMS 302 は終了です。

公式チュートリアル「MR and Azure 302 7章」を試してみる

本日はチュートリアルの実施枠です。
Academyの「MR and Azure 302: Computer vision」の実施内容をまとめます。
docs.microsoft.com
前回記事の続きです。
bluebirdofoz.hatenablog.com
今回は「Chapter 7」です。

Chapter 7:Call to Azure and Image Analysis

最後に作成するスクリプトは VisionManager クラスです。
このクラスは以下を担当します。
・取得した最新のイメージをバイト配列としてロードします。
・解析のためにAzure Computer Vision API Serviceインスタンスにバイト配列を送信します。
・応答をJSON文字列として受け取る。
・レスポンスをデシリアライズし、結果のタグをResultsLabelクラスに渡します。

1.Script フォルダを開きます。
2.フォルダ内で右クリックして、Creapte -> C# Script を選択します。
Script の名称は VisionManager に設定します。
f:id:bluebirdofoz:20180815094204j:plain

3.新しいスクリプトをダブルクリックしてVisual Studioで開きます。
4-9.以下の通り、スクリプトを編集します。
・VisionManager.cs

// 名前空間の追加
using System;
using System.Collections;
using System.Collections.Generic;
using System.IO;
using UnityEngine;
using UnityEngine.Networking;

public class VisionManager : MonoBehaviour {

    // Azureからの逆シリアル化されたJSON応答を表す2つのクラスを作成する
    [System.Serializable]
    public class TagData
    {
        public string name;
        public float confidence;
    }

    [System.Serializable]
    public class AnalysedObject
    {
        public TagData[] tags;
        public string requestId;
        public object metadata;
    }

    // メンバ変数の追加
    public static VisionManager instance;

    // you must insert your service key here!    
    // ここにサービスキーを挿入する必要があります
    private string authorizationKey = "- Insert your key here -";
    private const string ocpApimSubscriptionKeyHeader = "Ocp-Apim-Subscription-Key";
    // This is where you need to update your endpoint, if you set your location to something other than west-us.
    // ロケーションをwest-us以外の場所に設定した場合、エンドポイントを更新する必要があります。
    private string visionAnalysisEndpoint = "https://westus.api.cognitive.microsoft.com/vision/v1.0/analyze?visualFeatures=Tags";   

    internal byte[] imageBytes;

    internal string imagePath;

    private void Awake()
    {
        // allows this instance to behave like a singleton
        // このクラスをシングルトンと同じように動作させます 
        instance = this;
    }

    // ImageCaptureクラスでキャプチャした画像の解析結果を取得するコルーチン(静的ストリームメソッドを使用)を追加します
    /// <summary>
    /// Call the Computer Vision Service to submit the image.
    /// Computer Vision Service を呼び出して画像を送信します
    /// </summary>
    public IEnumerator AnalyseLastImageCaptured()
    {
        WWWForm webForm = new WWWForm();
        using (UnityWebRequest unityWebRequest = UnityWebRequest.Post(visionAnalysisEndpoint, webForm))
        {
            // gets a byte array out of the saved image
            // 保存されたイメージからバイト配列を取得する
            imageBytes = GetImageAsByteArray(imagePath);
            unityWebRequest.SetRequestHeader("Content-Type", "application/octet-stream");
            unityWebRequest.SetRequestHeader(ocpApimSubscriptionKeyHeader, authorizationKey);

            // the download handler will help receiving the analysis from Azure
            unityWebRequest.downloadHandler = new DownloadHandlerBuffer();

            // the upload handler will help uploading the byte array with the request
            // ダウンロードハンドラは、Azureから分析を受け取るのに役立ちます
            unityWebRequest.uploadHandler = new UploadHandlerRaw(imageBytes);
            unityWebRequest.uploadHandler.contentType = "application/octet-stream";

            yield return unityWebRequest.SendWebRequest();

            long responseCode = unityWebRequest.responseCode;

            try
            {
                string jsonResponse = null;
                jsonResponse = unityWebRequest.downloadHandler.text;

                // The response will be in Json format
                // therefore it needs to be deserialized into the classes AnalysedObject and TagData
                // 応答はJson形式になります
                //したがって、クラスをAnalysedObjectおよびTagDataにデシリアライズする必要があります
                AnalysedObject analysedObject = new AnalysedObject();
                analysedObject = JsonUtility.FromJson<AnalysedObject>(jsonResponse);

                if (analysedObject.tags == null)
                {
                    Debug.Log("analysedObject.tagData is null");
                }
                else
                {
                    Dictionary<string, float> tagsDictionary = new Dictionary<string, float>();

                    foreach (TagData td in analysedObject.tags)
                    {
                        TagData tag = td as TagData;
                        tagsDictionary.Add(tag.name, tag.confidence);
                    }

                    ResultsLabel.instance.SetTagsToLastLabel(tagsDictionary);
                }
            }
            catch (Exception exception)
            {
                Debug.Log("Json exception.Message: " + exception.Message);
            }

            yield return null;
        }
    }

    /// <summary>
    /// Returns the contents of the specified file as a byte array.
    /// 指定されたファイルの内容をバイト配列として返します
    /// </summary>
    private static byte[] GetImageAsByteArray(string imageFilePath)
    {
        FileStream fileStream = new FileStream(imageFilePath, FileMode.Open, FileAccess.Read);
        BinaryReader binaryReader = new BinaryReader(fileStream);
        return binaryReader.ReadBytes((int)fileStream.Length);
    }
}

※ 個人の環境に合わせて "-InsertYourAuthKeyHere-"の値を Chapter 1 で取得した Key 値に修正します。
"https://westus.api.cognitive.microsoft.com/~"の値も同様にエンドポイントの URL に修正します。
bluebirdofoz.hatenablog.com
f:id:bluebirdofoz:20180815094236j:plain

9.Visual Studio で変更を保存して Unity に戻ります。
f:id:bluebirdofoz:20180815094248j:plain

10.Scripts オブジェクトに Assets フォルダから VisionManagerおよびImageCaptureクラスをドラッグして適用します。
f:id:bluebirdofoz:20180815094319j:plain

Chapter 7 はここまでです。
次回は Chapter 8 ~ Chapter 10 を実施します。
bluebirdofoz.hatenablog.com

公式チュートリアル「MR and Azure 302 6章」を試してみる

本日はチュートリアルの実施枠です。
Academyの「MR and Azure 302: Computer vision」の実施内容をまとめます。
docs.microsoft.com
前回記事の続きです。
bluebirdofoz.hatenablog.com
今回は「Chapter 6」です。

Chapter 6:Create the ImageCapture class

2番目に作成するスクリプトは ImageCapture クラスです。
このクラスは以下を担当します。
・HoloLens カメラを使用して画像をキャプチャし、App フォルダに保存します。
・ユーザーのタップジェスチャーをキャプチャします。

1.Script フォルダを開きます。
2.フォルダ内で右クリックして、Creapte -> C# Script を選択します。
Script の名称は ImageCapture に設定します。
f:id:bluebirdofoz:20180814094444j:plain

3.新しいスクリプトをダブルクリックしてVisual Studioで開きます。
4-9.以下の通り、スクリプトを編集します。
・ImageCapture.cs

// 名前空間の追加
using System.IO;
using System.Linq;
using UnityEngine;
using UnityEngine.XR.WSA.Input;
using UnityEngine.XR.WSA.WebCam;

public class ImageCapture : MonoBehaviour {
    // メンバ変数の追加
    public static ImageCapture instance;
    public int tapsCount;
    private PhotoCapture photoCaptureObject = null;
    private GestureRecognizer recognizer;
    private bool currentlyCapturing = false;

    private void Awake()
    {
        // Allows this instance to behave like a singleton
        // このクラスをシングルトンと同じように動作させます 
        instance = this;
    }

    void Start()
    {
        // subscribing to the Hololens API gesture recognizer to track user gestures
        // ユーザーのジェスチャーを追跡するために Hololens API ジェスチャー認識プログラムに登録する
        recognizer = new GestureRecognizer();
        recognizer.SetRecognizableGestures(GestureSettings.Tap);
        recognizer.Tapped += TapHandler;
        recognizer.StartCapturingGestures();
    }

    /// <summary>
    /// Respond to Tap Input.
    /// タップ入力の応答処理
    /// </summary>
    private void TapHandler(TappedEventArgs obj)
    {
        // Only allow capturing, if not currently processing a request.
        // 要求を処理中でない場合のみ、キャプチャを許可します。
        if (currentlyCapturing == false)
        {
            currentlyCapturing = true;

            // increment taps count, used to name images when saving
            // タップカウントを加算します。
            // 保存時にイメージに名前を付けるために使用します。
            tapsCount++;

            // Create a label in world space using the ResultsLabel class
            // ResultsLabelクラスを使用してワールド空間にラベルを作成する
            ResultsLabel.instance.CreateLabel();

            // Begins the image capture and analysis procedure
            // 画像の取り込みと分析の処理を開始します。
            ExecuteImageCaptureAndAnalysis();
        }
    }

    /// <summary>
    /// Register the full execution of the Photo Capture. If successful, it will begin 
    /// the Image Analysis process.
    /// フォトキャプチャの実行を登録します。成功すると、画像解析プロセスが開始されます。
    /// </summary>
    void OnCapturedPhotoToDisk(PhotoCapture.PhotoCaptureResult result)
    {
        // Call StopPhotoMode once the image has successfully captured
        // キャプチャが正常に取得されたら StopPhotoMode を呼び出します。
        photoCaptureObject.StopPhotoModeAsync(OnStoppedPhotoMode);
    }

    void OnStoppedPhotoMode(PhotoCapture.PhotoCaptureResult result)
    {
        // Dispose from the object in memory and request the image analysis 
        // to the VisionManager class
        // メモリ内のオブジェクトから破棄し、VisionManager クラスに画像解析を要求する
        photoCaptureObject.Dispose();
        photoCaptureObject = null;
        StartCoroutine(VisionManager.instance.AnalyseLastImageCaptured());
    }

    /// <summary>    
    /// Begin process of Image Capturing and send To Azure     
    /// Computer Vision service.
    /// 画像キャプチャのプロセスを開始し、Azure Computer Visionサービスに送信します。
    /// </summary>    
    private void ExecuteImageCaptureAndAnalysis()
    {
        // Set the camera resolution to be the highest possible    
        // カメラの解像度を可能な限り高く設定する
        Resolution cameraResolution = PhotoCapture.SupportedResolutions.OrderByDescending((res) => res.width * res.height).First();

        Texture2D targetTexture = new Texture2D(cameraResolution.width, cameraResolution.height);

        // Begin capture process, set the image format    
        // キャプチャプロセスを開始し、イメージフォーマットの設定を行う。
        PhotoCapture.CreateAsync(false, delegate (PhotoCapture captureObject)
        {
            photoCaptureObject = captureObject;
            CameraParameters camParameters = new CameraParameters();
            camParameters.hologramOpacity = 0.0f;
            camParameters.cameraResolutionWidth = targetTexture.width;
            camParameters.cameraResolutionHeight = targetTexture.height;
            camParameters.pixelFormat = CapturePixelFormat.BGRA32;

            // Capture the image from the camera and save it in the App internal folder    
            // カメラから画像をキャプチャして、それをAppの内部フォルダに保存します。
            captureObject.StartPhotoModeAsync(camParameters, delegate (PhotoCapture.PhotoCaptureResult result)
            {
                string filename = string.Format(@"CapturedImage{0}.jpg", tapsCount);

                string filePath = Path.Combine(Application.persistentDataPath, filename);

                VisionManager.instance.imagePath = filePath;

                photoCaptureObject.TakePhotoAsync(filePath, PhotoCaptureFileOutputFormat.JPG, OnCapturedPhotoToDisk);

                currentlyCapturing = false;
            });
        });
    }
}

※ この時点で、Unity Editor Consoleパネルにエラーが表示されます(「The name ‘VisionManager’ does not exist...」)。
これは、コードが VisionManager クラスを参照するためです。VisionManager クラスは、次の章で作成します
f:id:bluebirdofoz:20180814094501j:plain

10.Visual Studio で変更を保存して Unity に戻ります。
f:id:bluebirdofoz:20180814094513j:plain

Chapter 6 はここまでです。
次回は Chapter 7 を実施します。
bluebirdofoz.hatenablog.com

公式チュートリアル「MR and Azure 302 5章」を試してみる

本日はチュートリアルの実施枠です。
Academyの「MR and Azure 302: Computer vision」の実施内容をまとめます。
docs.microsoft.com
前回記事の続きです。
bluebirdofoz.hatenablog.com
今回は「Chapter 5」です。

Chapter 5:Create the ResultsLabel class

最初に作成するスクリプトは ResultsLabel クラスです。
これは、次の処理を行います。
・適切なワールド空間で、カメラの位置を基準にしてラベルを作成する。
・画像解析からのタグの表示。

1.Script フォルダを作成します。
Asset フォルダで右クリックし、Create > Folder を選択します。
f:id:bluebirdofoz:20180814094003j:plain

2.作成した Script フォルダを開き、フォルダ内で右クリックして、Creapte -> C# Script を選択します。
Script の名称は ResultsLabel に設定します。
f:id:bluebirdofoz:20180814094015j:plain

3.新しいスクリプトをダブルクリックしてVisual Studioで開きます。
4.以下の通り、スクリプトを編集します。
・ResultsLabel.cs

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class ResultsLabel : MonoBehaviour
{
    public static ResultsLabel instance;

    public GameObject cursor;

    public Transform labelPrefab;

    [HideInInspector]
    public Transform lastLabelPlaced;

    [HideInInspector]
    public TextMesh lastLabelPlacedText;

    private void Awake()
    {
        // allows this instance to behave like a singleton
        // このクラスをシングルトンと同じように動作させます 
        instance = this;
    }

    /// <summary>
    /// Instantiate a Label in the appropriate location relative to the Main Camera.
    /// メインカメラに対して、適切な場所にラベルをインスタンス化します。
    /// </summary>
    public void CreateLabel()
    {
        lastLabelPlaced = Instantiate(labelPrefab, cursor.transform.position, transform.rotation);

        lastLabelPlacedText = lastLabelPlaced.GetComponent<TextMesh>();

        // Change the text of the label to show that has been placed
        // The final text will be set at a later stage
        // 配置されていることを示すラベルのテキストを変更する
        // 最終的にテキストは後の段階で設定されます
        lastLabelPlacedText.text = "Analysing...";
    }

    /// <summary>
    /// Set the Tags as Text of the last Label created. 
    /// ラベルのテキストにタグを追加します
    /// </summary>
    public void SetTagsToLastLabel(Dictionary<string, float> tagsDictionary)
    {
        lastLabelPlacedText = lastLabelPlaced.GetComponent<TextMesh>();

        // At this point we go through all the tags received and set them as text of the label
        // 受け取ったすべてのタグを調べ、ラベルのテキストとして設定します
        lastLabelPlacedText.text = "I see: \n";

        foreach (KeyValuePair<string, float> tag in tagsDictionary)
        {
            lastLabelPlacedText.text += tag.Key + ", Confidence: " + tag.Value.ToString("0.00 \n");
        }
    }
}

f:id:bluebirdofoz:20180814094034j:plain

5.Visual Studio で変更を保存して Unity に戻ります。
f:id:bluebirdofoz:20180814094056j:plain

6.Hierarchy パネルの空の領域を右クリックして、Create Empty で空の GameObject を追加します。
名前を Scripts に変更します。
f:id:bluebirdofoz:20180814094107j:plain

7.作成した Scripts オブジェクトに Assets フォルダから ResultsLabel クラスをドラッグして適用します。
f:id:bluebirdofoz:20180814094118j:plain

8.ResultsLabel(Script) コンポーネントのスロットを以下のように設定します。
a.Cursor スロットに Chapter 4 で作成した Cursor オブジェクトを設定する。
b.LabelPrefab スロットに Chapter 4 で作成した LabelText.prefab を設定する。
f:id:bluebirdofoz:20180814094129j:plain


Chapter 5 はここまでです。
次回は Chapter 6 を実施します。

公式チュートリアル「MR and Azure 302 2~4章」を試してみる

本日はチュートリアルの実施枠です。
Academyの「MR and Azure 302: Computer vision」の実施内容をまとめます。
docs.microsoft.com
前回記事の続きです。
bluebirdofoz.hatenablog.com
今回は「Chapter 2 ~ Chapter 4」です。

Chapter 2:Set up the Unity project

Chapter 3:Main Camera setup

チュートリアルページではプロジェクトの基本的な設定項目について全て手動で行っています。
これらの設定項目は MRTK を利用すれば自動で設定可能です。本記事では MRTK を利用します。

以下の手順ページの「HoloLens(WindowsMR) プロジェクトの基本設定」までを実施したプロジェクトを作成します。
bluebirdofoz.hatenablog.com
f:id:bluebirdofoz:20180813050559j:plain

InternetClient と Webcam の利用が必要なため、capabilites の設定を行います。
メニューから Mixed Reality Toolkit -> Configure -> Apply UWP Capability Settings を開きます。
f:id:bluebirdofoz:20180813050608j:plain

「Apply UWP Capability Settings」ダイアログが開くので、「InternetClient」と「Webcam」にチェックを入れて「Apply」を実行します。
f:id:bluebirdofoz:20180813050619j:plain

Chapter 4:Setup the Label system

HoloLens のカメラを使用して画像を取得すると、Azure Computer Vision API Service に画像が送信されて分析されます。
その分析の結果はタグと呼ばれる認識されたオブジェクトのリストになります。
写真を撮った場所にこれらのタグを表示するには Label を(ワールドスペースの3Dテキストとして)使用します。

次の手順では、Labelオブジェクトを設定する方法を示します。

1.Hierarchy パネル内の任意の場所(この時点では場所は関係ありません)を右クリックします。
3D Object -> 3D Text を選択して3Dテキストを追加します。LabelText という名前を付けます。
f:id:bluebirdofoz:20180813050628j:plain

2.LabelText オブジェクトを選択した状態で Inspector パネルを開き、次の変数を調整します。
a.Ref Transform の Position を X:0,Y:0,Z:0 に設定します。
b.Ref Transform の Scaleを X:0.01,Y:0.01,Z:0.01 に設定します。
c.Text Mesh の Text を 「...」に設定します。
d.Text Mesh の Anchor を Middle Cente に設定します。
e.Text Mesh の Aligment を Center に設定する
f.Text Mesh の Tab Size を 4 に設定する
g.Text Mesh の Font Size を 50 に設定する
h.Text Mesh の Color を #FFFFFFFF に設定する
f:id:bluebirdofoz:20180813050640j:plain

3.LabelText オブジェクトを Hierarchy パネルから Asset Folder にドラッグします。
これにより LabelText が Prefab になり、コード上でインスタンス化できるようになります。
f:id:bluebirdofoz:20180813050650j:plain

4.LabelText オブジェクトを Hierarchy パネルから削除して、シーンに表示されないようにする必要があります。
これは Assets フォルダから個々のインスタンスを呼び出す Prefab であるため、シーン内に保持する必要はありません。
f:id:bluebirdofoz:20180813050659j:plain

次に、ラベルを表示する位置を示すカーソルを作成します。

1.Hierarchy パネルの MixedRealityCameraParent を右クリックして、3D Object -> Sphere を選択します。
作成された Sphere オブジェクトを Cursor という名前に変更します。
f:id:bluebirdofoz:20180813050708j:plain

2.Cursort オブジェクトを選択した状態で Inspector パネルを開き、次の変数を調整します。
a.Ref Transform の Position を X:0,Y:0,Z:5 に設定します。
b.Ref Transform の Scaleを X:0.02,Y:0.02,Z:0.02 に設定します。
f:id:bluebirdofoz:20180813050719j:plain

Hierarchy パネルの最終的なオブジェクト構造は、下の図に示すようになります。
f:id:bluebirdofoz:20180813050729j:plain

Chapter 4 はここまでです。
次回は Chapter 5 を実施します。
bluebirdofoz.hatenablog.com

公式チュートリアル「MR and Azure 302 1章」を試してみる

本日はチュートリアルの実施枠です。
Academyの「MR and Azure 302: Computer vision」の実施内容をまとめます。
docs.microsoft.com
docs.microsoft.com
今回は「概要 ~ Chapter 1」です。

概要

このコースでは、複合現実感アプリケーションで Azure Computer Vision 機能を使用して、提供されたイメージ内のビジュアルコンテンツを認識する方法を学習します。
認識結果は記述タグとして表示されます。機械学習モデルを訓練する必要なく、このサービスを使用できます。

Microsoft Computer Vision はイメージ処理と分析を開発者に提供するために設計された一連の API です。
開発者はイメージまたはイメージの URL をアップロードします。
Microsoft Computer Vision API アルゴリズムは、ユーザーが選択した入力に基づいてビジュアルコンテンツを分析します。

このコースを修了すると、次のことができる複合現実感のアプリケーションが作成されます:
1.タップジェスチャーを使用して、HoloLens のカメラが画像をキャプチャします。
2.画像は Azure Computer Vision API サービスに送信されます。
3.認識されたオブジェクトは、Unity Scene に配置された簡単な UI グループにリストされます。

アプリケーションでは、結果をデザインとどのように統合するかはあなた次第です。
このコースは Azure サービスと Unity プロジェクトを統合する方法を教えてくれるように設計されています。

バイスのサポート

このコースは主に HoloLens に重点を置いています。
このコースで学んだことは Windows Mixed Reality immersive(VR)ヘッドセットにも適用できます。
没入型(VR)ヘッドセットにはアクセス可能なカメラがないため、PC に外付けカメラが接続されている必要があります。
コースに沿って進むと、没入型(VR)ヘッドセットをサポートするために必要となる可能性のある変更に関するメモが表示されます。

前提条件

このコースには、次のハードウェアとソフトウェアをお勧めします。
Windows Mixed Realityと互換性のある開発用PC
・開発者モードを有効にしたWindows 10 Fall Creators Update(またはそれ以降)
・最新のWindows 10 SDK
・Unity 2017.4
Visual Studio 2017
・開発者モードを有効にしたWindows Mixed Reality immersive(VR)ヘッドセットまたはMicrosoft HoloLens
・内蔵マイク付きヘッドフォンセット(ヘッドセットに内蔵マイクとスピーカーがない場合)
・AzureのセットアップとComputer Vision APIの取得のためのインターネットアクセス

始める前に

1.このチュートリアルで言及したプロジェクトをルートまたはルートに近いフォルダに作成することを強く推奨します。
(長いフォルダパスはビルド時に問題を引き起こす可能性があります)。
2.あなたの HoloLens をセットアップし、テストしてください。
3.新しい HoloLens App の開発を開始するときに、キャリブレーションとセンサーチューニングを実行することをお勧めします。

Chapter 1:Azure Portal

Computer Vision APIサービスをアプリケーションで利用できるようにサービスのインスタンスを設定する必要があります。

1.Azure Portalにログインします。
(Azureログインについては以下記事でまとめています。)
bluebirdofoz.hatenablog.com

2.ログインしたら、左上隅の[リソースの作成]をクリックし、[Computer Vision API]を検索します。Enterを実行します。
 [Computer Vision API]が見つかるので、これを選択します。
f:id:bluebirdofoz:20180813050155j:plain

3.新しいページに Computer Vision API の説明が表示されます。
 このページの左下にある[作成]ボタンをクリックして、このサービスとの関連付けを作成します。
f:id:bluebirdofoz:20180813050207j:plain

4.作成をクリックしたら新しいページが表示されます。以下の各種情報を設定します。
a.このサービスインスタンスの希望する名前を挿入します。
b.利用するサブスクリプションを選択します。
c.あなたに適した価格設定ティアを選択します。
Computer Vision API Service を初めて作成する場合は、無料のティア(F0という名前)をご利用いただけます。
d.リソースグループを選択するか、新しいリソースグループを作成します。
リソースグループは、Azureアセットの収集を監視し、アクセスを制御し、課金を管理し、管理する方法を提供します。
単一のプロジェクト(これらのラボなど)に関連付けられている全てのAzureサービスを共通のリソースグループに保つことをお勧めします。
3.リソースグループの場所を決定します(新しいリソースグループを作成する場合)。
場所は、アプリケーションが実行される領域にあるのが理想的です。一部のAzure資産は一部の地域でのみ利用可能です。
また、本サービスに適用される利用規約を理解したことを確認する必要があります。
各種情報を設定したら[作成]を選択します。
f:id:bluebirdofoz:20180813050216j:plain

5.Createをクリックすると、サービスが作成されるまで待つ必要がありますが、これには数分かかることがあります。
6.サービスインスタンスが作成されると、通知がポータルに表示されます。
7.通知をクリックすると、新しいサービスインスタンスが表示されます。[リソースに移動]を選択します。
f:id:bluebirdofoz:20180813050240j:plain

8.新しいComputer Vision API Serviceインスタンスの[Quick start]ページが表示されます。
f:id:bluebirdofoz:20180813050349j:plain

9.このチュートリアルでは、アプリケーションはサービスのサブスクリプションキーを使用してサービスを呼び出す必要があります。10.ナビゲーションメニューにある鍵のアイコンで示される[Keys」タブを開きます。これにより、サービスキーが表示されます。
(または、[Quick start]の[Grab your keys]にある[Keys]のリンクをクリックすることでも確認できます)
11.プロジェクトの後半で必要になるので、表示されたキーのコピーを取ってください。
f:id:bluebirdofoz:20180813050359j:plain

12.[Quick start]ページに戻り、後で使用するためにエンドポイントのコピーを取ってください。
f:id:bluebirdofoz:20180813050409j:plain

Chapter 1 はここまでです。
次回は Chapter 2 ~ 4 まで実施します。
bluebirdofoz.hatenablog.com

公式チュートリアル「MR and Azure 301」の記事をまとめる

本日はまとめ枠です。
公式チュートリアル「MR and Azure 301」を実施した記事についてまとめておきます。

Chapter 2 ~ 4

bluebirdofoz.hatenablog.com

Chapter 10 ~ 11

bluebirdofoz.hatenablog.com