---
# System prepended metadata

title: Azure

---

# Azure

### Azure 第一堂課筆記

待更...

### Azure 第二堂課筆記

待更...

### Azure 第三堂課筆記

前端遊戲都是走canvas出來

---

![](https://hackmd.io/_uploads/HJHlGZwrh.png)


![](https://hackmd.io/_uploads/ryzWGbwrn.png)

全域和區域會有一行code會有影響

![](https://hackmd.io/_uploads/BkOGzZvH3.png)

![](https://hackmd.io/_uploads/ryXQf-PSn.png)


![](https://hackmd.io/_uploads/ryhmfWvrn.png)

![](https://hackmd.io/_uploads/B1vEM-vB2.png)

![](https://hackmd.io/_uploads/ryZBMbwH3.png)

怎麼改的css

改背景色而已

---

##臉部驗證

把幾百張明星照片用迴圈和自己的照片做比對，最後觀看信心指數超過0.8/0.9，就代表你有明星臉

![](https://hackmd.io/_uploads/SyUDfbPrh.png)

## canvas 搭配azure人臉辨識
1. 首先讓每個人臉都有框
2. 再讓每個框上都顯示出信心指數
    - 先找到位置（距離左邊和上方的距離）
    - 讓它置中，所以要+上寬度/2，設定center就要這樣做
3. 再根據信心指數，讓不同的框，顯示不同顏色

![](https://hackmd.io/_uploads/SyxnM-vHn.png)



![](https://hackmd.io/_uploads/r1C3zbPBh.png)

```
 //把所有臉框畫上去
            for(let x=0;x<data.length;x++){
                let thisFaceRect=data[x].faceRectangle;
                thisCanvasCTX.lineWidth=5;
                //抓到smile指數
                let smile=data[x].faceAttributes.smile;
                console.log(smile);
                //根據信心指數調整框的顏色
                if(smile>0.8){
                    thisCanvasCTX.strokeStyle="yellow"
                }else{
                    thisCanvasCTX.strokeStyle="red"
                }
                //設定文字大小
                thisCanvasCTX.font="30px Arial";
                //設置文字顏色
                thisCanvasCTX.fillStyle="yellow";
                //把文字置中
                thisCanvasCTX.textAlign = "center";
                //thisFaceRect.left最左邊
                //因為有設textAlign = "center"，
                //所以要thisFaceRect.left+thisFaceRect.width/2
                //fillText是設定文字的位置
                thisCanvasCTX.fillText(smile,thisFaceRect.left+thisFaceRect.width/2, thisFaceRect.top);
                thisCanvasCTX.strokeRect(thisFaceRect.left, thisFaceRect.top,thisFaceRect.width,thisFaceRect.height);

            }
```

這跟azure有啥關係?

人臉識別就是azure阿

然後他講HTML的canvas喔?

對


![](https://hackmd.io/_uploads/B1tzX-Drh.png)

![](https://hackmd.io/_uploads/ry0zQbvrn.png)


![](https://hackmd.io/_uploads/rJGHmZPr3.png)

![](https://hackmd.io/_uploads/rJCH7-vrh.png)


![](https://hackmd.io/_uploads/BkuLm-wS3.png)


剛剛publsh建完之後要做啥
![](https://hackmd.io/_uploads/BJfD7bDB3.png)

就到這裡
貼key 和網址
uriBase 貼網址


修正辨識率的方式就是，去圖庫更改圖片或是上傳更多圖片後，再度訓練,之後再去JS更換publish網址

![](https://hackmd.io/_uploads/ryr9QZDSn.png)

```
   .done(function(data) {
        //顯示JSON內容
        $("#responseTextArea").val(JSON.stringify(data, null, 2));
        //先清空
        $("#picDescription").empty();
        for(let x=0; x<data.predictions.length;x++){
            let name;
            //if (data.predictions[x].probability >= 0.6 && data.predictions[x].tagName == "chinese food") {
            //看你要比較的tag名稱是什麼
            if(data.predictions[x].tagName == "Japanese food"){
              //  $("#picDescription").text("應該是中華料理! (信心:" + data.predictions[x].probability +")")
               // break;
               //你要顯示的名稱
               name="Japanese food";
            } else {
               // $("#picDescription").text("應該是日本料理! ");
               //你要顯示的被比較tag名稱
               name="chinese food";
            }
            //一次在圖片下方顯示兩種tag得信心指數
            $("#picDescription").append( "有" +Math.round(data.predictions[x].probability *100)+"%的機率是"+name+ "<br>");
        }
       // $("#picDescription").text();
    })

```


---


0527  一樣是custom vision
canvas 找出點後，分別+上寬高/2就是中心點

先下載圖片

![](https://hackmd.io/_uploads/rkfkUO-Lh.png)

![](https://hackmd.io/_uploads/HySe8_W83.png)

下一步是按綠色的train

先框然後tag

直接點圖片
再點鳥就能框
![](https://hackmd.io/_uploads/BJRfLu-Ih.png)

最後他們會變成tagged
在案右邊箭頭
持續到完成全部照片
每一個tag都要有15張照片，沒符合張數的標籤建議刪除
![](https://hackmd.io/_uploads/rJMdIuZ82.png)
![](https://hackmd.io/_uploads/ByudIOZIn.png)
長尾山雀

最好弄多個tag 再利用threshold value 讓他去探測

![](https://hackmd.io/_uploads/S1kaIu-Ih.png)


---

Azure ML

組長建立一個工作區和一個六核心cpu主機

![](https://hackmd.io/_uploads/B1BpUO-8n.png)
![](https://hackmd.io/_uploads/H106UubLn.png)

![](https://hackmd.io/_uploads/SyH1wuZI3.png)
計算執行個體/新增  來建立主機

![](https://hackmd.io/_uploads/Sy1gP_Z8n.png)

![](https://hackmd.io/_uploads/S1g-wOW8h.png)

![](https://hackmd.io/_uploads/HyYWDOb82.png)

左上角ㄉ
空白的,然後新增

![](https://hackmd.io/_uploads/SkhzDObU2.png)
![](https://hackmd.io/_uploads/ByUND_Z8h.png)
![](https://hackmd.io/_uploads/HyiEDubUh.png)
齒輪/設定選你的主機

![](https://hackmd.io/_uploads/SynSDuZI2.png)
![](https://hackmd.io/_uploads/B1xUP_bU3.png)
![](https://hackmd.io/_uploads/BJrUD_WL2.png)
儲存後再按另外一個縮小或是關閉
在拉你的到右邊工作區，接著就點兩下，選輸出
![](https://hackmd.io/_uploads/HyJKPubL2.png)

![](https://hackmd.io/_uploads/rJgiw_-L3.png)
![](https://hackmd.io/_uploads/SyVsPObU3.png)
砍下30%資料來做測試
![](https://hackmd.io/_uploads/HyWhPOWL2.png)
![](https://hackmd.io/_uploads/rkuhDuWI3.png)

![](https://hackmd.io/_uploads/H1Q6DOWL3.png)
一樣是對score model點兩下去觀看結果

Scored Labels 是AI幫你計算之後的結果
這邊是跟charges做比較

---

web那個啥怎近來

左邊打字搜尋

web service input

在拉過去右邊


![](https://hackmd.io/_uploads/BJLGuO-8h.png)

之後提交
![](https://hackmd.io/_uploads/r1LXO_ZUh.png)

![](https://hackmd.io/_uploads/rk3Qu_WI3.png)
接著在部屬


![](https://hackmd.io/_uploads/BJA4_OW83.png)
這裡觀看進度
![](https://hackmd.io/_uploads/HkVOO_WUh.png)


---

安裝python

可以在vscode 找到實際安裝位置，再去設定環境變數，這樣就能在任何地方使用終端機查看版本，不然就只能在安裝的資料結下確認版本

C:\Users\User\AppData\Local\Programs\Python\Python311

![](https://hackmd.io/_uploads/BJrkYdWI3.png)

![](https://hackmd.io/_uploads/r10hdO-83.png)


隨便建一個資料夾，然後新增一個app.py
![](https://hackmd.io/_uploads/S10JYdZU2.png)


安裝flask
在你python安裝資料夾路徑下輸入以下指令來安裝
python -m pip install flask
![](https://hackmd.io/_uploads/ryF7tubU2.png)


接著再確認版本
![](https://hackmd.io/_uploads/HklwKu-In.png)


有些人則是要進入到Scripts才能確認flask版本
cd Scripts
![](https://hackmd.io/_uploads/rJMuYubUh.png)


![](https://hackmd.io/_uploads/rk6TKd-L3.png)


![](https://hackmd.io/_uploads/H14AtdZ8n.png)

![](https://hackmd.io/_uploads/BJt0tdZUn.png)

分別新增到系統變數的PATH

- C:\Users\User\AppData\Local\Programs\Python\Python311

- C:\Users\User\AppData\Local\Programs\Python\Python311\Scripts

![](https://hackmd.io/_uploads/BkIZ9_W82.png)

之後可以再測試一次 --version


![](https://hackmd.io/_uploads/rJPM9dW82.png)
透過app.py能找到安裝路徑


![](https://hackmd.io/_uploads/HkyH9ubUh.png)
同時新增資料夾和檔案


![](https://hackmd.io/_uploads/B1orcOWL2.png)
再次submit也能停留在同一個頁面


重開VS CODE 就能連上去了(重開server的意思?)


![](https://hackmd.io/_uploads/HkRcqu-82.png)

![](https://hackmd.io/_uploads/SklVoqOWI2.png)

![](https://hackmd.io/_uploads/rk_hcu-U2.png)


https://docs.google.com/document/d/18VsvkBfMXKFJxfhWp5EQSEtUNXEq_9k73gXkqAdFI0s/edit

