Robotics UI เป็นโซลูชันเว็บอินเตอร์เฟสสำหรับหุ่นยนต์ที่ขับเคลื่อนด้วย ROS 2 โดยใช้ Irace และ ROS 2 Iron
วิสัยทัศน์ของเราคือการสร้างซอฟต์แวร์ที่ช่วยให้คุณสามารถเพิ่มเว็บอินเตอร์เฟสลงในหุ่นยนต์ ROS 2 ทุกตัวได้ทันทีโดยการกำหนดค่าไฟล์ JSON แบบง่าย

เครื่องมือประกอบด้วยสองส่วน: แบ็กเอนด์ Python ซึ่งทำหน้าที่เป็นเลเยอร์การแปลระหว่าง ROS 2 และ REACE Frontend เพื่อให้บรรลุสิ่งนี้เรากำลังแปลข้อความ ROS 2 เป็น JSON และย้อนกลับ

ในส่วนหน้าเราใช้การออกแบบตามหน้าต่างที่แต่ละหน้าต่างเป็นโปรแกรมไมโครของตัวเองที่เชื่อมต่อกับข้อมูล JSON จากแบ็กเอนด์ สิ่งนี้ช่วยให้เราสามารถใช้วิธีการปลั๊กอินและสำหรับผู้ใช้ในการปรับแต่งแดชบอร์ดของพวกเขา เป้าหมายคือสำหรับผู้ใช้ในการสร้างปลั๊กอินที่กำหนดเอง
นอกจากนี้ยังมีการสนับสนุนทางโทรศัพท์ที่มีการออกแบบที่กะทัดรัดมากขึ้น

การตั้งค่าเหล็ก ROS 2 ที่เราใช้
ในการใช้แพ็คเกจ ROS 2 คุณต้องติดตั้งแพ็คเกจต่อไปนี้:
ติดตั้ง ROS
export ROS_DISTRO=ironตั้งค่า fastapi
sudo apt install python3-pip
pip install fastapi
pip install uvicorn การพึ่งพาอื่น ๆ
pip install pyyamlติดตั้ง NVM
sudo apt update
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.3/install.sh | bash
nvm install nodeนำทางไปยังโฟลเดอร์ Ros 2 Workspace SRC ของคุณและดาวน์โหลดแพ็คเกจ
cd ~ /ros2_ws/src
git clone https://github.com/sciotaio/robotics-ui.git นำทางไปยังโฟลเดอร์ Workspace ของคุณและติดตั้งแพ็คเกจ ros2_webinterface
cd ~ /ros2_ws
colcon build --packages-select ros2_webinterface && source install/setup.bashนำทางไปยังโฟลเดอร์ React Project
cd ~ /ros2_ws/src/robotics-web/react/robotics_ui/ติดตั้งการอ้างอิงด้วย NPM
npm install # test launch
ros2 launch ros2_webinterface test.launch.py
# main launch (only the webinterface)
ros2 launch ros2_webinterface webinterface.launch.py
# waypoint_manager launch (Backend for the OpenStreetMap Plugin)
ros2 launch ros2_webinterface waypoint_manager.launch.py cd ~ /ros2_ws/src/robotics-web/react/robotics_ui/
npm startTODO: อธิบายวิธีการเปลี่ยนการตั้งค่าโฮสต์และพร็อกซีและวิธีการเปลี่ยนที่อยู่แบ็กเอนด์
คู่มือผู้ใช้อธิบายวิธีปรับแต่งแอปพลิเคชันและวิธีการใช้งานในโครงการของคุณ
คู่มือนี้อธิบายวิธีการสร้างและกำหนดค่าไฟล์การกำหนดค่า JSON เพื่อสร้างแดชบอร์ดที่กำหนดเองของคุณ
เริ่มต้นส่วนหน้าและเปิดในเว็บเบราว์เซอร์ (ที่อยู่เริ่มต้น http: // localhost: 3000/)
หน้าต่อไปนี้ควรเปิด:

ไปที่บรรณาธิการ Section JSON
ในตัวแก้ไข JSON คุณมีหลายตัวเลือก:

คุณสามารถอัปโหลดไฟล์การกำหนดค่า JSON หรือลิงค์แดชบอร์ด
ลิงก์แดชบอร์ดรวมถึงการกำหนดค่า JSON เป็นพารามิเตอร์ลิงก์ ตัวอย่างเช่น: http: // localhost: 3000/dashboard/settings? component = [{"id": "stringtopic", "state": false, "render_type": "String", "ตำแหน่ง": {"x": 0, "y": 0}, "ขนาด": {"width": 200, "ความสูง": 200}, "หัวข้อ": [{"ชื่อ": "หัวข้อ 1", "หัวข้อ": "/topic1", "type": "String", "Route": "/subscriber/topic1"}]}] & preset_list = undefined
ในการใช้ลิงค์ JSON คุณสามารถคลิกปุ่ม "ใช้ลิงค์ JSON"
หรือคุณสามารถใช้ปุ่ม "ใช้ลิงค์เริ่มต้น JSON" เพื่อเลือกลิงค์สาธิตที่บันทึกไว้ล่วงหน้า
ในการกำหนดค่าไฟล์ JSON คุณสามารถใช้แบบฟอร์มเว็บ
เป็นการแนะนำให้เพิ่มองค์ประกอบง่าย ๆ :




ในกรณีของเราประเภทการเรนเดอร์สตริงมาพร้อมกับหัวข้อที่กำหนดไว้ล่วงหน้า
ต่อไปเราต้องกำหนดค่าหัวข้อของส่วนประกอบ หัวข้อให้ข้อมูลส่วนหน้าที่จำเป็นในการโทร API ไปยังแบ็กเอนด์และพวกเขาแต่ละคนมีคุณสมบัติ 4 ประการ:
หมายเลขและลำดับของหัวข้อถูกกำหนดโดยประเภทของปลั๊กอินที่เราใช้ดังนั้นโปรดปรึกษาเอกสารประกอบปลั๊กอินสำหรับข้อมูลนั้น
หากเราต้องการลบหรือเพิ่มหัวข้อเราสามารถใช้ปุ่ม "เพิ่มหัวข้อ" หรือ "ลบหัวข้อ"
ในการใช้การกำหนดค่าเรามีหลายตัวเลือก:
ด้วยปุ่ม "สร้าง JSON" เราสามารถพิมพ์ไฟล์ JSON ไปยังคอนโซลเครื่องมือ DEV ได้
ด้วยปุ่ม "ดาวน์โหลด JSON" เราสามารถดาวน์โหลดไฟล์ JSON ได้
ด้วยปุ่ม "ใช้ JSON" เราสามารถเปิดแดชบอร์ดโดยตรงด้วยการตั้งค่าที่กำหนดค่าไว้
หากคุณต้องการเข้าถึงแดชบอร์ดที่แน่นอนเดียวกันในอนาคตคุณสามารถคัดลอกลิงก์ในส่วนลิงก์ได้
ในการใช้ไฟล์การกำหนดค่าที่กำหนดเองในแบ็กเอนด์คุณต้องตั้งค่านี้เป็นคุณสมบัติในไฟล์เปิดตัวที่กำหนดเองของคุณ
ตัวอย่างไฟล์เปิดตัวอาจมีลักษณะเช่นนี้:
import os
from launch import LaunchDescription
from launch_ros . actions import Node
from launch . actions import IncludeLaunchDescription
from launch . launch_description_sources import PythonLaunchDescriptionSource
from ament_index_python . packages import get_package_share_directory
def generate_launch_description ():
share_dir = get_package_share_directory ( 'ros2_webinterface' )
launch_dir = os . path . join ( share_dir , 'launch' )
webinterface = IncludeLaunchDescription (
PythonLaunchDescriptionSource (
os . path . join ( launch_dir , 'webinterface.launch.py' )
),
launch_arguments = {
"yaml_config" : "topic_list.yaml" , # Name of the YAML config
file
"json_config" : "topic_list.json" , # Name of the JSON config file
"config_folder" : 'default' , # Path to the folder
# or 'default' to use the
# standard config folder
}. items (),
)
ld = LaunchDescription ()
ld . add_action ( webinterface )
return ldไฟล์ YAML อาจว่างเปล่า - มันจะถูกเขียนทับโดยอัตโนมัติด้วยการกำหนดค่าที่ถูกต้องเมื่อเปิดใช้งาน
ปลั๊กอินช่วยให้คุณสามารถปรับแต่งแดชบอร์ดของคุณได้ต่อไป
ขณะนี้แอพมาพร้อมกับปลั๊กอินที่แตกต่างกัน 3 ตัว

คู่มือปลั๊กอินแผนที่ถนนเปิด
ศูนย์แผนที่ Open Street ช่วยให้คุณสามารถติดตามหุ่นยนต์ของคุณบนแผนที่และส่งคำแนะนำ GPS Waypoint ด้วยการคลิกง่าย ๆ
นอกจากนี้คุณยังสามารถอยู่ตรงกลางบนหุ่นยนต์ด้วยปุ่มกลางรวมถึงลบและตั้งค่าจุดทาง

ปลั๊กอินนี้ช่วยให้คุณสามารถแสดงข้อมูล JSON ที่เข้ามาได้
โปรดส่งคำแนะนำของคุณสำหรับปลั๊กอิน
คู่มือเกี่ยวกับวิธีการติดตั้งและกำหนดค่าปลั๊กอิน:
คู่มือปลั๊กอิน
std_msgs.msg
sensor_msgs.msg
std_msgs.msg
รูปแบบเพิ่มเติมที่มาในการอัปเดตในอนาคต