---
# System prepended metadata

title: 傑出的一手！ - 遠程手臂控制
tags: [lab, iot-car]

---

---
title: 傑出的一手！ - 遠程手臂控制
slideOptions:
  transition: slide
  transitionSpeed: 'fast'
  theme: league
---

<!-- .slide: data-background="https://i.imgur.com/gJLfldF.jpg" data-background-color="#111111" data-background-opacity="0.2" -->

###### tags: `iot-car` `lab`  返回[物聯網智慧自走車](/s/5c7ggGf0Spqql5Gy31Cqzg)
## 傑出的一手！ <br> <span style="color:#F9BF45;">遠程手臂控制</span>

###### [點我開啟簡報模式](/@BEExANT-ta/SJ6aLRE_K#)

###### <kbd>ESC</kbd> 鍵進入總覽模式

###### <kbd>&#8592;</kbd> <kbd>&#8593;</kbd> <kbd>&#8595;</kbd> <kbd>&#8594;</kbd> 切換頁面

---

<center><img src="https://i.imgur.com/PUFq6ZU.jpg" width=40%></img></center>

在**電子電路實驗與JavaScript物聯網應用**這套教具的 [LAB04 - 控制二軸機械手臂](https://hackmd.io/@BEExANT-ta/js-iot/%2Fs%2F9ntHyjh0RBWR2NewpjNQLw) 中我們已熟悉如何調整並控制機械手臂，這單元要讓==自走車與第一套教具進行連線==，實作==M2M==(Machine To Machine)來讓自走車==遠程控制手臂==進行待機、搬貨等動作。

----

:::info
:globe_with_meridians:  參考資源
- [M2M - 維基百科](https://zh.wikipedia.org/wiki/%E6%A9%9F%E5%99%A8%E5%B0%8D%E6%A9%9F%E5%99%A8)

:::

---

## 目標

**在自走車網頁中設定外部wifi連線至第一套教具，設定遠端IP為第一套教具之IP後，以自走車的顏色判斷來控制手臂進行待機、搬貨的動作。**

---

## 設計原理

- 手臂控制模式照[LAB04 - 控制二軸機械手臂](https://hackmd.io/@BEExANT-ta/js-iot/%2Fs%2F9ntHyjh0RBWR2NewpjNQLw)進行調整。
- 第一套教具(10.10.10.10)與自走車(10.10.20.10)的==IP必須不同才能進行遠程控制==，預設已設定好不同IP，若要另外設定可依[內建Js參數及功能總覽](/s/wlfjvQBzRPCmJ8LCL3f2Fg)內的指令進行調整。
- 網路設定請參考 [遠程控制網路設定](/s/UrpBFetqTfagugoaksoDCg) 中的步驟進行設定。

---

## 範例程式碼

新增程式檔並命名 ==遠程手臂控制==，將以下程式碼複製貼上程式編輯區執行。

```javascript=
window.state = "待機";
let armTop = 7;
let armMiddle = 6;
let armBottom = 5;
let idle_color = "黑";
let work_color = "紅";
let F = DATA.colorF[3];
let B = DATA.colorB[3];
let L = DATA.colorL[3];
let R = DATA.colorR[3];

console.log("手臂狀態： " + state);

if(F == idle_color && B == idle_color && L == idle_color && R == idle_color)
{
  state = "待機";
}

if(F == work_color && B == work_color && L == work_color && R == work_color)
{
  state = "搬貨";
}

if(state == "待機"){
  console.log("恢復至待機位置...");
  remote_servo[armBottom].set(160);
  delay(1000);
  remote_servo[armMiddle].set(0);
  delay(1000);
  remote_servo[armTop].set(0);
  delay(1000);
  state = "停止";
  console.log("已恢復待機位置");
}

if(state == "搬貨"){
  console.log("搬貨中...");
  remote_servo[armTop].set(60);
  delay(1000);
  remote_servo[armMiddle].set(30);
  delay(1000);
  remote_servo[armBottom].set(30);
  delay(1000);
  remote_servo[armMiddle].set(0);
  delay(1000);
  remote_servo[armTop].set(0);
  delay(1000);
  remote_servo[armMiddle].set(30);
  delay(1000);
  remote_servo[armBottom].set(160);
  delay(1000);
  remote_servo[armMiddle].set(0);
  delay(1000);
  state = "停止";
  console.log("搬貨結束");
}
```

---

## 程式解說
逐行講解程式意義。

----

```javascript=
window.state = "待機";
```

- 定義全域變數state，記錄手臂控制模式。

----

```javascript=
let armBottom = 5;
let armMiddle = 6;
let armTop = 7;
```

- 定義區域變數，分別設定為手臂==下方馬達==(armBottom)、手臂==中間馬達==(armMiddle)、手臂==夾子==(armTop)的腳位==編號==。

----

```javascript=
let idle_color = "黑";
let work_color = "紅";
```

- 定義待機模式(idle_color)與搬貨模式(work_color)顏色。

----

```javascript=
let F = DATA.colorF[3];
let B = DATA.colorB[3];
let L = DATA.colorL[3];
let R = DATA.colorR[3];
```
- 定義區域變數，分別設定為四個方向顏色的值。

----

```javascript=
console.log("手臂狀態： " + state);
```
- 顯示目前狀態資訊。

----

```javascript=
if(F == idle_color && B == idle_color && L == idle_color && R == idle_color)
{
  state = "待機";
}

if(F == work_color && B == work_color && L == work_color && R == work_color)
{
  state = "搬貨";
}
```
- 使用==顏色判斷來切換手臂模式==，當皆為設定的==待機顏色==時設為==待機==，皆為==工作顏色==時設為==搬貨==。

----

```javascript=
if(state == "待機"){
  console.log("恢復至待機位置...");
  remote_servo[armBottom].set(160);
  delay(1000);
  remote_servo[armMiddle].set(0);
  delay(1000);
  remote_servo[armTop].set(0);
  delay(1000);
  state = "停止";
  console.log("已恢復待機位置");
}
```

- 當判斷狀態為==待機==時，依據設定好的步驟使用 ==```remote_servo[].set()```== 遠程控制手臂，並在==結束控制命令時將state設為停止==。

----

```javascript=
if(state == "搬貨"){
  console.log("搬貨中...");
  remote_servo[armTop].set(60);
  delay(1000);
  remote_servo[armMiddle].set(30);
  delay(1000);
  remote_servo[armBottom].set(30);
  delay(1000);
  remote_servo[armMiddle].set(0);
  delay(1000);
  remote_servo[armTop].set(0);
  delay(1000);
  remote_servo[armMiddle].set(30);
  delay(1000);
  remote_servo[armBottom].set(160);
  delay(1000);
  remote_servo[armMiddle].set(0);
  delay(1000);
  state = "停止";
  console.log("搬貨結束");
}
```

- 當判斷狀態為==搬貨==時，依據設定好的步驟使用 ==```remote_servo[].set()```== 遠程控制手臂，並在==結束控制命令時將state設為停止==。

---

## 參數修改
為方便實作，以下會將範例程式中可修改的參數標示出來，進行實作時只需修改對應參數，並觀察結果即可。

:::warning
:zap: 詳細內建JS參數參考 - [內建Js參數及功能總覽](/s/wlfjvQBzRPCmJ8LCL3f2Fg)
:::

----

:::success
**let armBottom = ==x==;
let armMiddle = ==y==;
let armTop = ==z==;**
:::

- x,y,z分別代表手臂馬達在pca9685上的腳位，==0 ~ 7 對應至 1 ~ 8號腳位==。

----

:::success
**remote_servo[==x==].set(==y==);**
:::

- x代表手臂馬達的編號，可直接代入==編號==或是==使用變數==(armBottom,armMiddle,armTop)。
- y代表馬達轉角，範圍在 0 ~ 180間。

---

## 範例影片

{%youtube eHL7-Rvzj40 %}

<a class="btn btn-warning" style="width:100%;color:#333333;"  href="/s/rVVZVo_rTg201uLszRsOYg" role="button"> 自動停車系統 **&#8680;**  </a>

<a class="btn btn-primary" style="width:100%;"  href="/s/d1hp6YXwTRuI71wx2ogw_g" role="button"> **&#8678;** 水平移動避障
</a>