Software Project : Robotic Arm (3) - เขียน Web ครั้งที่ 1
วันที่ 2 ตุลาคม พ.ศ.2562
หลังการสามารถควบคุมแขนกลทั้ง 6 ตัว ผ่าน Python ได้แล้ว จึงทำการเขียนหน้าเว็บเพื่อทำการสั่งจากหน้าเว็บ โดยได้คิดหน้าเว็บไว้ 2 แบบ
1.กดปุ่มที่กำหนดองศาได้เเล้ว
2.กดปุ่มซ้าย-ขวา ขยับทีละ 5 องศา
โดยทำแบบเเรกก่อน
เขียนโค้ด HTML ให้ได้โครงเว็บก่อนหลังจากนั้นจะทำการตกเเต่งด้วย CSS
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="BEAUTIFUL.css">
</head>
<title>{{ Author }}'s app</title>
<body>
<h2> Servo </h2>
<form action="/" method="post">
<input type="submit" name="submit" id="keys1" value="1/0">
<input type="submit" name="submit" id="keys2" value="1/20">
<input type="submit" name="submit" id="keys3" value="1/40">
<input type="submit" name="submit" id="keys4" value="1/60">
<input type="submit" name="submit" id="keys5" value="1/80">
<input type="submit" name="submit" id="keys6" value="1/100">
<input type="submit" name="submit" id="keys7" value="1/120">
<input type="submit" name="submit" id="keys8" value="1/140">
<input type="submit" name="submit" id="keys9" value="1/160">
<input type="submit" name="submit" id="keys10" value="1/180"><p>
<input type="submit" name="submit" id="keys11" value="2/0">
<input type="submit" name="submit" id="keys12" value="2/20">
<input type="submit" name="submit" id="keys13" value="2/40">
<input type="submit" name="submit" id="keys14" value="2/60">
<input type="submit" name="submit" id="keys15" value="2/80">
<input type="submit" name="submit" id="keys16" value="2/100">
<input type="submit" name="submit" id="keys17" value="2/120">
<input type="submit" name="submit" id="keys18" value="2/140">
<input type="submit" name="submit" id="keys19" value="2/160">
<input type="submit" name="submit" id="keys20" value="2/180"><p>
<input type="submit" name="submit" id="keys21" value="3/0">
<input type="submit" name="submit" id="keys22" value="3/20">
<input type="submit" name="submit" id="keys23" value="3/40">
<input type="submit" name="submit" id="keys24" value="3/60">
<input type="submit" name="submit" id="keys25" value="3/80">
<input type="submit" name="submit" id="keys26" value="3/100">
<input type="submit" name="submit" id="keys27" value="3/120">
<input type="submit" name="submit" id="keys28" value="3/140">
<input type="submit" name="submit" id="keys29" value="3/160">
<input type="submit" name="submit" id="keys30" value="3/180"><p>
<input type="submit" name="submit" id="keys31" value="4/0">
<input type="submit" name="submit" id="keys32" value="4/20">
<input type="submit" name="submit" id="keys33" value="4/40">
<input type="submit" name="submit" id="keys34" value="4/60">
<input type="submit" name="submit" id="keys35" value="4/80">
<input type="submit" name="submit" id="keys36" value="4/100">
<input type="submit" name="submit" id="keys37" value="4/120">
<input type="submit" name="submit" id="keys38" value="4/140">
<input type="submit" name="submit" id="keys39" value="4/160">
<input type="submit" name="submit" id="keys40" value="4/180"><p>
<input type="submit" name="submit" id="keys41" value="5/0">
<input type="submit" name="submit" id="keys42" value="5/20">
<input type="submit" name="submit" id="keys43" value="5/40">
<input type="submit" name="submit" id="keys44" value="5/60">
<input type="submit" name="submit" id="keys45" value="5/80">
<input type="submit" name="submit" id="keys46" value="5/100">
<input type="submit" name="submit" id="keys47" value="5/120">
<input type="submit" name="submit" id="keys48" value="5/140">
<input type="submit" name="submit" id="keys49" value="5/160">
<input type="submit" name="submit" id="keys50" value="5/180"><p>
<input type="submit" name="submit" id="keys51" value="6/0">
<input type="submit" name="submit" id="keys52" value="6/20">
<input type="submit" name="submit" id="keys53" value="6/40">
<input type="submit" name="submit" id="keys54" value="6/60">
<input type="submit" name="submit" id="keys55" value="6/80">
<input type="submit" name="submit" id="keys56" value="6/100">
<input type="submit" name="submit" id="keys57" value="6/120">
<input type="submit" name="submit" id="keys58" value="6/140">
<input type="submit" name="submit" id="keys59" value="6/160">
<input type="submit" name="submit" id="keys60" value="6/180"><p>
</form>
</body>
</html>
หน้าเว็บที่ได้
หลังจากได้หน้าเว็บทำการเขียนโค้ด Python ในการสั่ง
Python
import serial import time servo = serial.Serial("COM4", 9600) class Servo(): def LA0(self): servo.write(bytearray([0])) time.sleep(0.05) def LA20(self): servo.write(bytearray([4])) time.sleep(0.05) def LA40(self): servo.write(bytearray([8])) time.sleep(0.05) def LA60(self): servo.write(bytearray([12])) time.sleep(0.05) def LA80(self): servo.write(bytearray([16])) time.sleep(0.05) def LA100(self): servo.write(bytearray([20])) time.sleep(0.05) def LA120(self): servo.write(bytearray([24])) time.sleep(0.05) def LA140(self): servo.write(bytearray([28])) time.sleep(0.05) def LA160(self): servo.write(bytearray([32])) time.sleep(0.05) def LA180(self): servo.write(bytearray([36])) time.sleep(0.05) def LB0(self): servo.write(bytearray([37])) time.sleep(0.05) def LB20(self): servo.write(bytearray([41])) time.sleep(0.05) def LB40(self): servo.write(bytearray([45])) time.sleep(0.05) def LB60(self): servo.write(bytearray([49])) time.sleep(0.05) def LB80(self): servo.write(bytearray([53])) time.sleep(0.05) def LB100(self): servo.write(bytearray([57])) time.sleep(0.05) def LB120(self): servo.write(bytearray([61])) time.sleep(0.05) def LB140(self): servo.write(bytearray([65])) time.sleep(0.05) def LB160(self): servo.write(bytearray([69])) time.sleep(0.05) def LB180(self): servo.write(bytearray([73])) time.sleep(0.05) def LC0(self): servo.write(bytearray([74])) time.sleep(0.05) def LC20(self): servo.write(bytearray([78])) time.sleep(0.05) def LC40(self): servo.write(bytearray([82])) time.sleep(0.05) def LC60(self): servo.write(bytearray([86])) time.sleep(0.05) def LC80(self): servo.write(bytearray([90])) time.sleep(0.05) def LC100(self): servo.write(bytearray([94])) time.sleep(0.05) def LC120(self): servo.write(bytearray([98])) time.sleep(0.05) def LC140(self): servo.write(bytearray([102])) time.sleep(0.05) def LC160(self): servo.write(bytearray([106])) time.sleep(0.05) def LC180(self): servo.write(bytearray([110])) time.sleep(0.05) def LD0(self): servo.write(bytearray([111])) time.sleep(0.05) def LD20(self): servo.write(bytearray([115])) time.sleep(0.05) def LD40(self): servo.write(bytearray([119])) time.sleep(0.05) def LD60(self): servo.write(bytearray([123])) time.sleep(0.05) def LD80(self): servo.write(bytearray([127])) time.sleep(0.05) def LD100(self): servo.write(bytearray([131])) time.sleep(0.05) def LD120(self): servo.write(bytearray([135])) time.sleep(0.05) def LD140(self): servo.write(bytearray([139])) time.sleep(0.05) def LD160(self): servo.write(bytearray([143])) time.sleep(0.05) def LD180(self): servo.write(bytearray([147])) time.sleep(0.05) def LE0(self): servo.write(bytearray([148])) time.sleep(0.05) def LE20(self): servo.write(bytearray([152])) time.sleep(0.05) def LE40(self): servo.write(bytearray([156])) time.sleep(0.05) def LE60(self): servo.write(bytearray([160])) time.sleep(0.05) def LE80(self): servo.write(bytearray([164])) time.sleep(0.05) def LE100(self): servo.write(bytearray([168])) time.sleep(0.05) def LE120(self): servo.write(bytearray([172])) time.sleep(0.05) def LE140(self): servo.write(bytearray([176])) time.sleep(0.05) def LE160(self): servo.write(bytearray([180])) time.sleep(0.05) def LE180(self): servo.write(bytearray([184])) time.sleep(0.05) def LF0(self): servo.write(bytearray([185])) time.sleep(0.05) def LF20(self): servo.write(bytearray([189])) time.sleep(0.05) def LF40(self): servo.write(bytearray([193])) time.sleep(0.05) def LF60(self): servo.write(bytearray([197])) time.sleep(0.05) def LF80(self): servo.write(bytearray([201])) time.sleep(0.05) def LF100(self): servo.write(bytearray([205])) time.sleep(0.05) def LF120(self): servo.write(bytearray([209])) time.sleep(0.05) def LF140(self): servo.write(bytearray([213])) time.sleep(0.05) def LF160(self): servo.write(bytearray([217])) time.sleep(0.05) def LF180(self): servo.write(bytearray([221]))
time.sleep(0.05)
from flask import Flask,render_template,request import time app = Flask(__name__)#Webapptime.sleep(3)#delay 3 วินาที@app.route('/', methods=['POST', 'GET']) def CS(): Author = "Gram" if request.method == "POST": import BA A = BA.Servo() if request.form['submit']=='1/0': A.LA0() elif request.form['submit']=='1/20': A.LA20() elif request.form['submit']=='1/40': A.LA40() elif request.form['submit']=='1/60': A.LA60() elif request.form['submit']=='1/80': A.LA80() elif request.form['submit']=='1/100': A.LA100() elif request.form['submit']=='1/120': A.LA120() elif request.form['submit']=='1/140': A.LA140() elif request.form['submit']=='1/160': A.LA160() elif request.form['submit']=='1/180': A.LA180() elif request.form['submit']=='2/0': A.LB0() elif request.form['submit']=='2/20': A.LB20() elif request.form['submit']=='2/40': A.LB40() elif request.form['submit']=='2/60': A.LB60() elif request.form['submit']=='2/80': A.LB80() elif request.form['submit']=='2/100': A.LB100() elif request.form['submit']=='2/120': A.LB120() elif request.form['submit']=='2/140': A.LB140() elif request.form['submit']=='2/160': A.LB160() elif request.form['submit']=='2/180': A.LB180() elif request.form['submit']=='3/0': A.LC0() elif request.form['submit']=='3/20': A.LC20() elif request.form['submit']=='3/40': A.LC40() elif request.form['submit']=='3/60': A.LC60() elif request.form['submit']=='3/80': A.LC80() elif request.form['submit']=='3/100': A.LC100() elif request.form['submit']=='3/120': A.LC120() elif request.form['submit']=='3/140': A.LC140() elif request.form['submit']=='3/160': A.LC160() elif request.form['submit']=='3/180': A.LC180() elif request.form['submit']=='4/0': A.LD0() elif request.form['submit']=='4/20': A.LD20() elif request.form['submit']=='4/40': A.LD40() elif request.form['submit']=='4/60': A.LD60() elif request.form['submit']=='4/80': A.LD80() elif request.form['submit']=='4/100': A.LD100() elif request.form['submit']=='4/120': A.LD120() elif request.form['submit']=='4/140': A.LD140() elif request.form['submit']=='4/160': A.LD160() elif request.form['submit']=='4/180': A.LD180() elif request.form['submit']=='5/0': A.LE0() elif request.form['submit']=='5/20': A.LE20() elif request.form['submit']=='5/40': A.LE40() elif request.form['submit']=='5/60': A.LE60() elif request.form['submit']=='5/80': A.LE80() elif request.form['submit']=='5/100': A.LE100() elif request.form['submit']=='5/120': A.LE120() elif request.form['submit']=='5/140': A.LE140() elif request.form['submit']=='5/160': A.LE160() elif request.form['submit']=='5/180': A.LE180() elif request.form['submit']=='6/0': A.LF0() elif request.form['submit']=='6/20': A.LF20() elif request.form['submit']=='6/40': A.LF40() elif request.form['submit']=='6/60': A.LF60() elif request.form['submit']=='6/80': A.LF80() elif request.form['submit']=='6/100': A.LF100() elif request.form['submit']=='6/120': A.LF120() elif request.form['submit']=='6/140': A.LF140() elif request.form['submit']=='6/160': A.LF160() elif request.form['submit']=='6/180': A.LF180() return render_template('index.html',Author=Author,value = 100) if __name__ == "__main__":
app.run(debug=True)
เมื่อเขียนเสร็จจะควบคุม Servo ได้ทุกตัวเเบบกำหนดองศา โดยโค้ดจะทำการปรับปรุงเรื่อยๆ
อุปสรรค
- ปัญหาในการเขียนโค้ด
- ปัญหาการ รับ - ส่ง ข้อมูลของ Arduino
- โค้ดยาวไป อาจจะทำให้สั้นกว่านี้ได้

ความคิดเห็น
แสดงความคิดเห็น